'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-58ea899e.js');
const component = require('./component-1e352960.js');
const number = require('./number-4816603d.js');
const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-9110cb94.js');
const vegaEventId = require('./vega-event-id-d9994eb3.js');
const pageSizeOptionUtils = require('./page-size-option-utils-d038dd3a.js');
const ui = require('./ui-ae4ee13d.js');
const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-f3979a03.js');
const eventEmitSlimmer = require('./event-emit-slimmer-80e1c8ca.js');
const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-4572c5b7.js');
const translationSlimmer = require('./translation-slimmer-3cd7d3b2.js');
const responsiveFormatFacade = require('./responsive-format-facade-5f6cd211.js');
const breakpoints = require('./breakpoints-1cc2c4c6.js');
const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-273d62ef.js');
const vegaInternalEventId = require('./vega-internal-event-id-87014e4f.js');
const featureFlagController = require('./feature-flag-controller-9129ef52.js');
require('./change-manager-a297e4d2.js');
require('./observer-f49483e8.js');
require('./internal-vega-event-manager-7e0d966d.js');
require('./vega-env-manager-23b8b23c.js');
require('./dynamic-slimmer-f31fdfd7.js');
require('./try-get-document-c0ebd39a.js');
require('./internal-translation-controller-8360a89c.js');
require('./static-subject-title-5829a298.js');
require('./type-guard-2e97fc56.js');
require('./breakpoints-ebde4837.js');
require('./ui-32120990.js');
require('./typography-4560e7f1.js');
require('./pixel-98f2a10c.js');
require('./array-249289f2.js');
require('./index-f054eb5d.js');

const VegaPaginationCurrentPageLabel = ({ pageSize, current, total, translationSlimmer, }) => {
  const rangeFrom = total > 0 ? pageSize * (current - 1) + 1 : 0;
  const rangeTo = Math.min(current * pageSize, total);
  return (index.h("vega-field-label", { label: translationSlimmer.t('Viewing {0}-{1} of {2}', rangeFrom, rangeTo, total) }));
};

const VegaPaginationGoTo = ({ onChange, pageCount, translationSlimmer, }) => {
  let inputRef;
  const handleChange = () => {
    if (inputRef.value) {
      const goToPage = number.normalizeNumberByRanger(number.convertToNumber(inputRef.value, 1), 1, pageCount);
      onChange(goToPage);
      inputRef.value = '';
    }
  };
  const stopChangePropagation = (e) => {
    e.stopPropagation();
  };
  return (index.h("vega-flex", { alignItems: "center", justifyContent: "center", gap: "size-8" },
    index.h("vega-field-label", { label: translationSlimmer.t('Go To') }),
    index.h("vega-form", { 
      /* eslint-disable-next-line react/jsx-no-bind */
      ref: (ref) => {
        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, vegaEventId.VegaFormSubmit, handleChange);
      } },
      index.h("vega-input", { "data-vega-form": "paginationGoTo", type: "number", size: "small", autocomplete: "on", showClearIcon: false, style: { width: '60px' }, maskConfig: {
          type: 'number',
          options: {
            allowNegative: false,
            precision: 0,
          },
        }, 
        /* eslint-disable-next-line react/jsx-no-bind */
        onVegaChange: stopChangePropagation, 
        /* eslint-disable-next-line react/jsx-no-bind */
        onChange: stopChangePropagation, 
        /* eslint-disable-next-line react/jsx-no-bind */
        ref: (ref) => {
          inputRef = ref;
          domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, vegaEventId.VegaBlur, handleChange);
        } }))));
};

const VegaPaginationPageSizeSelector = ({ pageSize, pageSizeSelectorOptions, dropdownProps, onChange, translationSlimmer, isAllActive, }) => {
  const normalized = pageSizeSelectorOptions.map(pageSizeOptionUtils.normalizePageSizeOption);
  const mergedPageSizeOptions = pageSizeOptionUtils.sortPageSizeOptions(normalized);
  const handleChange = (input) => {
    // Because input-select use single mode, so the detail is always a string type
    const selectedValue = Number(input.detail);
    onChange(selectedValue);
  };
  const selectedValue = isAllActive ? pageSizeOptionUtils.PAGE_SIZE_ALL : pageSize;
  return (index.h("vega-flex", { alignItems: "center", justifyContent: "center", gap: "size-8" },
    index.h("vega-field-label", { label: translationSlimmer.t('Show') }),
    index.h("div", null,
      index.h("vega-input-select", { size: "small", source: mergedPageSizeOptions.map((option) => ({
          id: option.value.toString(),
          displayName: option.label,
        })), value: selectedValue.toString(), placeholder: "Page Size", vegaDropdownProps: Object.assign({ matchTargetWidth: false, searchable: false }, dropdownProps), 
        /* eslint-disable-next-line react/jsx-no-bind */
        ref: (ref) => {
          domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, vegaEventId.VegaChange, handleChange);
        } }))));
};

/**
 *  minimal pager item count, must be odd number
 */
const MINIMAL_PAGER_ITEM_COUNT = 7;
/**
 * It generates an array of numbers and ellipsis that represent the pager items
 *
 * @param {number} current - the current page number
 * @param {number} total - the total number of pages
 * @param {number} [pagerCount=7] - the count of pager items, must be odd number
 * @returns {(number | string)[]} returns an array of page numbers and placeholders
 */
const generatePagerItems = (current, total, pagerCount = MINIMAL_PAGER_ITEM_COUNT) => {
  const ellipsisPlaceholder = '...';
  if (pagerCount < MINIMAL_PAGER_ITEM_COUNT) {
    throw new Error(`Must allow at least ${MINIMAL_PAGER_ITEM_COUNT} pager items`);
  }
  if (pagerCount % 2 === 0) {
    throw new Error(`Must allow odd number of pager items`);
  }
  if (total < pagerCount) {
    return Array(total)
      .fill(0)
      .map((_, index) => index + 1);
  }
  const left = Math.max(1, Math.min(total - pagerCount + 1, current - Math.floor(pagerCount / 2)));
  const items = new Array(pagerCount);
  for (let i = 0; i < pagerCount; i += 1) {
    items[i] = i + left;
  }
  if (Number(items[0]) > 1) {
    items[0] = 1;
    items[1] = ellipsisPlaceholder;
  }
  if (Number(items[items.length - 1]) <= total - 1) {
    items[items.length - 1] = total;
    items[items.length - 2] = ellipsisPlaceholder;
  }
  return items;
};

const VegaPaginationPageSelector = ({ total, current, onChange, pageCount, }) => {
  const pagerItem = (page) => {
    const isCurrent = current === page ? 'active' : '';
    const clickable = current !== page;
    return (
    /* no-noninteractive-element-to-interactive-role https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/main/docs/rules/no-noninteractive-element-to-interactive-role.md */
    index.h("li", { key: page, class: ui.arrayToClassString(['vega-pagination-item', isCurrent]) },
      index.h("button", { 
        /* eslint-disable-next-line react/jsx-no-bind */
        onClick: () => clickable && onChange(page) }, page)));
  };
  /** Render the prev button of the pager **/
  const renderPrevButton = () => {
    const isDisabled = total === 0 || current === 1;
    return pagerButton('chevron-left', isDisabled, handlePrev);
  };
  /** Render the next button of the pager **/
  const renderNextButton = () => {
    const isDisabled = total === 0 || current === pageCount;
    return pagerButton('chevron-right', isDisabled, handleNext);
  };
  const renderPagers = () => {
    if (total === 0) {
      return [pagerItem(1)];
    }
    const pagerItems = generatePagerItems(current, pageCount);
    return pagerItems.map((item) => {
      if (typeof item === 'string') {
        return pagerEllipsis();
      }
      else {
        return pagerItem(item);
      }
    });
  };
  const pagerButton = (icon, isDisabled, handleClick) => {
    return (index.h("li", { class: ui.arrayToClassString(['vega-pagination-button', isDisabled && 'disabled']) },
      index.h("vega-button-circle", { variant: "icon-only", icon: icon, iconColor: "text-link", size: "small", disabled: isDisabled, 
        /* eslint-disable-next-line react/jsx-no-bind */
        ref: (ref) => {
          domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, vegaEventId.VegaClick, handleClick);
        } })));
  };
  const handlePrev = () => {
    onChange(current - 1);
  };
  const handleNext = () => {
    onChange(current + 1);
  };
  const pagerEllipsis = () => {
    return index.h("li", { class: "vega-pagination-item pager-ellipsis" }, "...");
  };
  return (index.h("ul", { class: "vega-pagination" },
    renderPrevButton(),
    renderPagers(),
    renderNextButton()));
};

var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/** The `VegaPaginationPageSizeObserverController` class is responsible for adding and removing observers for pagination page size in Vega component. */
class VegaPaginationPageSizeObserverController extends globalSlimmerRegistry.VegaSlimmer {
  /**
   * Add the pagination page size subject observer
   */
  registerPaginationPageSizeChangeObserver() {
    domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, vegaInternalEventId.VegaInternalPaginationPageSizeChange, (payload) => {
      const rawValue = Number(payload.detail);
      this.isAllActive = rawValue === pageSizeOptionUtils.PAGE_SIZE_ALL;
      this.pageSize = pageSizeOptionUtils.resolvePageSizeValue(rawValue, this.total);
    });
  }
  /**
   * Remove the pagination page size subject observer
   */
  unregisterPaginationPageSizeChangeObserver() {
    domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, vegaInternalEventId.VegaInternalPaginationPageSizeChange);
  }
}
__decorate$3([
  globalSlimmerRegistry.MapToComponentField()
], VegaPaginationPageSizeObserverController.prototype, "host", void 0);
__decorate$3([
  globalSlimmerRegistry.MapToComponentField({ writable: true })
], VegaPaginationPageSizeObserverController.prototype, "pageSize", void 0);
__decorate$3([
  globalSlimmerRegistry.MapToComponentField({ writable: true })
], VegaPaginationPageSizeObserverController.prototype, "isAllActive", void 0);
__decorate$3([
  globalSlimmerRegistry.MapToComponentField()
], VegaPaginationPageSizeObserverController.prototype, "total", void 0);
__decorate$3([
  globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
], VegaPaginationPageSizeObserverController.prototype, "registerPaginationPageSizeChangeObserver", null);
__decorate$3([
  globalSlimmerRegistry.MapToComponentMethod('disconnectedCallback')
], VegaPaginationPageSizeObserverController.prototype, "unregisterPaginationPageSizeChangeObserver", null);

var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/** The `VegaPaginationCurrentPageObserverController` class is responsible for adding and removing observers for pagination current in Vega component. */
class VegaPaginationCurrentPageObserverController extends globalSlimmerRegistry.VegaSlimmer {
  /**
   * Add the pagination current subject observer
   */
  registerPaginationCurrentChangeObserver() {
    domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, vegaInternalEventId.VegaInternalPaginationCurrentChange, (payload) => {
      this.current = Number(payload.detail);
    });
  }
  /**
   * Remove the pagination current subject observer
   */
  unregisterPaginationCurrentChangeObserver() {
    domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, vegaInternalEventId.VegaInternalPaginationCurrentChange);
  }
}
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaPaginationCurrentPageObserverController.prototype, "host", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField({ writable: true })
], VegaPaginationCurrentPageObserverController.prototype, "current", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
], VegaPaginationCurrentPageObserverController.prototype, "registerPaginationCurrentChangeObserver", null);
__decorate$2([
  globalSlimmerRegistry.MapToComponentMethod('disconnectedCallback')
], VegaPaginationCurrentPageObserverController.prototype, "unregisterPaginationCurrentChangeObserver", null);

var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/** Manage the layout of vega-pagination */
class VegaPaginationLayoutController extends pageResizeObserverSlimmer.PageResizeObserverSlimmer {
  /**
   * Register the callback function to page resize observer slimmer
   */
  constructor() {
    super({
      // eslint-disable-next-line jsdoc/require-jsdoc
      callback: /* istanbul ignore next */ () => {
        this.calculatePaginationLayout();
      },
    });
    /** calculate the horizontal or vertical layout of vega-pagination */
    this.calculatePaginationLayout = () => {
      if (this.currentLayout === 'vertical') {
        this.host.classList.add('vega-pagination-vertical');
        this.host.classList.remove('vega-pagination-horizontal');
      }
      else {
        this.host.classList.remove('vega-pagination-vertical');
        this.host.classList.add('vega-pagination-horizontal');
        const hostOffsetHeight = this.host.offsetHeight;
        const directVegaFlexElements = Array.from(this.host.shadowRoot.children).filter((child) => child.tagName === 'VEGA-FLEX');
        const isLineWrapped = directVegaFlexElements.every((vegaFlexElement) => hostOffsetHeight > vegaFlexElement.offsetHeight);
        /*
         * The next line is covered in e2e-test
         * @see{should-render-layout-properly-when-set-responsive-prop-layout}
         */
        /* istanbul ignore next */
        if (isLineWrapped) {
          this.host.classList.add('vega-pagination-vertical');
          this.host.classList.remove('vega-pagination-horizontal');
        }
      }
    };
  }
  /** set the currentLayout when component will load */
  componentWillLoad() {
    this.setCurrentLayout();
  }
  /*
   * The next line is covered in e2e-test
   * @see{should-render-layout-properly-when-set-responsive-prop-layout}
   */
  /* istanbul ignore next */
  /** set the currentLayout when currentBreakpoint changes */
  watchCurrentBreakpoint() {
    this.setCurrentLayout();
  }
  /** set the currentLayout and calculate pagination layout when layout changes */
  watchLayout() {
    this.setCurrentLayout();
    this.calculatePaginationLayout();
  }
  /** set the value of currentLayout */
  setCurrentLayout() {
    this.currentLayout = responsiveFormatFacade.ResponsiveFormatFacade.formatCustom(this.layout);
  }
}
__decorate$1([
  globalSlimmerRegistry.MapToComponentField()
], VegaPaginationLayoutController.prototype, "host", void 0);
__decorate$1([
  globalSlimmerRegistry.MapToComponentField()
], VegaPaginationLayoutController.prototype, "layout", void 0);
__decorate$1([
  globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
], VegaPaginationLayoutController.prototype, "componentWillLoad", null);
__decorate$1([
  globalSlimmerRegistry.MapToComponentMethod('watchCurrentBreakpoint')
], VegaPaginationLayoutController.prototype, "watchCurrentBreakpoint", null);
__decorate$1([
  globalSlimmerRegistry.MapToComponentMethod('watchLayout')
], VegaPaginationLayoutController.prototype, "watchLayout", null);

const vegaPaginationCss = ":host{display:flex;align-items:center;line-height:normal;flex-wrap:wrap}:host(.vega-pagination-horizontal){flex-direction:row;justify-content:space-between}:host(.vega-pagination-vertical){flex-direction:column;gap:16px;justify-content:center}@media (min-width: 320px){:host(.vega-pagination-horizontal){gap:4px}}@media (min-width: 768px){:host(.vega-pagination-horizontal){gap:24px}}.vega-pagination{display:flex;padding:0px;margin:0px}.vega-pagination .vega-pagination-item{list-style-type:none;display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;color:rgba(var(--v-text-link, 19, 98, 226, 1));cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}@media screen and (min-width: 768px) and (max-width: 1023px){.vega-pagination .vega-pagination-item{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.vega-pagination .vega-pagination-item{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.vega-pagination .vega-pagination-item{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}.vega-pagination .vega-pagination-item button{background-color:rgba(var(--v-bg-transparent, 0, 0, 0, 0));border-width:0px;outline:2px solid transparent;outline-offset:2px;width:100%;height:100%;cursor:pointer;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;color:rgba(var(--v-text-link, 19, 98, 226, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){.vega-pagination .vega-pagination-item button{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.vega-pagination .vega-pagination-item button{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.vega-pagination .vega-pagination-item button{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}.vega-pagination .vega-pagination-item.pager-ellipsis{cursor:default}.vega-pagination .vega-pagination-item:not(.pager-ellipsis):not(:active):hover{text-decoration:underline;text-underline-offset:2px}.vega-pagination .vega-pagination-item button:active,.vega-pagination .vega-pagination-item.active button{color:rgba(var(--v-text-primary, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}@media screen and (min-width: 768px) and (max-width: 1023px){.vega-pagination .vega-pagination-item button:active,.vega-pagination .vega-pagination-item.active button{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.vega-pagination .vega-pagination-item button:active,.vega-pagination .vega-pagination-item.active button{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.vega-pagination .vega-pagination-item button:active,.vega-pagination .vega-pagination-item.active button{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}.vega-pagination .vega-pagination-item button:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:0px;border-radius:9999px}.vega-pagination .vega-pagination-button{list-style-type:none;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}";

var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
    r = Reflect.decorate(decorators, target, key, desc);
  else
    for (var i = decorators.length - 1; i >= 0; i--)
      if (d = decorators[i])
        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
const VegaPagination = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.vegaChange = index.createEvent(this, "vegaChange", 7);
    this.change = index.createEvent(this, "change", 7);
    this.vegaPageSizeChange = index.createEvent(this, "vegaPageSizeChange", 7);
    this.pageSizeChange = index.createEvent(this, "pageSizeChange", 7);
    this.globalSlimmers = {};
    this.translationSlimmer = new translationSlimmer.TranslationSlimmer();
    this.childEventPrevent = new childNodesEventPreventSlimmer.ChildNodesEventPreventSlimmer([vegaEventId.VegaFormSubmit], () => this.host);
    this.childValueChangePrevent = new childNodesEventPreventSlimmer.ChildNodesEventPreventSlimmer([vegaEventId.VegaChange], () => this.host, true);
    this.vegaChangeEventEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaPagination, vegaEventId.VegaChange);
    this.vegaPageSizeChangeEventEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaPagination, vegaEventId.VegaPageSizeChange);
    this.vegaComponentUsageRuntimeMetricsSlimmer = new componentUsageRuntimeMetrics.VegaComponentUsageRuntimeMetricsSlimmer();
    this.vegaPaginationPageSizeObserverController = new VegaPaginationPageSizeObserverController();
    this.vegaPaginationCurrentPageObserverController = new VegaPaginationCurrentPageObserverController();
    this.breakpointPageResizeObserverSlimmer = new pageResizeObserverSlimmer.PageResizeObserverSlimmer();
    this.vegaPaginationLayoutController = new VegaPaginationLayoutController();
    this.vegaPaginationItemTypes = [
      'currentPageLabel',
      'pageSizeSelector',
      'pageSelector',
      'goTo',
      'pageSelectorMobile',
      'pageSizeSelectorMobile',
      'pageSelectorMobile_goTo',
      'pageSizeSelectorMobile_currentPageLabel',
    ];
    this.currentBreakpoint = breakpoints.getCurrentBreakpoint();
    /**
     * Total number of pages.
     */
    this.pageCount = 0;
    /** Tracks whether "All" was explicitly selected or initialized. */
    this.isAllActive = false;
    /**
     * Specifies the current page number for
     *    the pagination component.
     *
     * @vegaVersion 1.3.0
     */
    /* eslint-disable-next-line @stencil/strict-mutable */
    this.current = 1;
    /**
     * Specifies the total number of data items for the pagination component.
     *
     * @vegaVersion 1.3.0
     */
    this.total = 0;
    /**
     * Specifies the number of data items to be displayed per page in
     *    the pagination component.
     *
     * @vegaVersion 1.3.0
     */
    /* eslint-disable-next-line @stencil/strict-mutable */
    this.pageSize = 10;
    /**
     * Specifies the extensions associated with the pagination items
     *    in the pagination component.
     *
     * It refers to additional elements or components that can be added to
     *    enhance the functionality or appearance of each pagination item.
     *
     * @VegaWarning - Note: The default value is controlled by feature flag `VEGA_PAGINATION.ENABLE_EXTENSIONS_RESPONSIVE_DEFAULT_VALUE`, which is disabled by default.
     *              - To enable the new responsive default value `{
              default: [['pageSizeSelectorMobile_currentPageLabel'], ['pageSelectorMobile_goTo']],
                M: [['pageSelector']],
                    }`, please enable the feature flag.
     * @vegaVersion 1.25.0
     * @defaultValue [['pageSelector']]
     */
    this.extensions = featureFlagController.FeatureFlag.isEnabled('VEGA_PAGINATION.ENABLE_EXTENSIONS_RESPONSIVE_DEFAULT_VALUE')
      ? {
        default: [['pageSizeSelectorMobile_currentPageLabel'], ['pageSelectorMobile_goTo']],
        M: [['pageSelector']],
      }
      : [['pageSelector']];
    /**
     * Specifies the layout of the elements.
     *
     * It determines how the pagination elements are arranged, with options such as 'horizontal' for a horizontal layout or other defined layouts.
     *
     * @vegaVersion 2.42.0
     */
    this.layout = 'horizontal';
    /**
     * Specifies the options available for the page size selector
     *    in the pagination component.
     *
     * Each option can be a number or an object with `value` and `label`.
     * Use `{ value: -1, label: 'All' }` to show all items on a single page.
     *
     * @vegaVersion 1.25.0
     */
    /* eslint-disable-next-line @stencil/strict-mutable */
    this.pageSizeSelectorOptions = [10, 20, 50, 100];
    this.renderPaginationItemsWrapper = (extensionArr) => {
      return (index.h("vega-flex", { gap: { default: 'size-4', M: 'size-24' }, flexWrap: "wrap", alignItems: "center", justifyContent: "center", key: this.generateWrapperKey(extensionArr) }, extensionArr.map((item) => {
        return index.h("div", { key: item }, this.renderPaginationItem(item));
      })));
    };
    this.renderPaginationItem = (item) => {
      switch (item) {
        case 'currentPageLabel':
          return (index.h(VegaPaginationCurrentPageLabel, { total: this.total, current: this.current, pageSize: this.pageSize, translationSlimmer: this.translationSlimmer }));
        case 'pageSizeSelector': {
          const pageSizeSelectorOptions = this.isAllActive || pageSizeOptionUtils.includesPageSize(this.pageSizeSelectorOptions, this.pageSize)
            ? this.pageSizeSelectorOptions
            : [...this.pageSizeSelectorOptions, this.pageSize];
          return (index.h(VegaPaginationPageSizeSelector, { pageSize: this.pageSize, pageSizeSelectorOptions: pageSizeSelectorOptions, dropdownProps: this.dropdownProps, onChange: this.onPageSizeSelectorChange, translationSlimmer: this.translationSlimmer, isAllActive: this.isAllActive }));
        }
        case 'pageSelector':
          return (index.h(VegaPaginationPageSelector, { current: this.current, total: this.total, onChange: this.onPageSelectorChange, pageCount: this.pageCount }));
        case 'goTo':
          return (index.h(VegaPaginationGoTo, { onChange: this.handlePaginationGoToChange, pageCount: this.pageCount, translationSlimmer: this.translationSlimmer }));
        case 'pageSelectorMobile':
        case 'pageSelectorMobile_goTo':
          return (index.h("vega-pagination-page-selector-mobile", { type: item, pageCount: this.pageCount, current: this.current, total: this.total }));
        case 'pageSizeSelectorMobile':
        case 'pageSizeSelectorMobile_currentPageLabel':
          return (index.h("vega-pagination-page-size-selector-mobile", { type: item, pageSize: this.pageSize, current: this.current, total: this.total, pageSizeSelectorOptions: this.pageSizeSelectorOptions, dropdownProps: this.dropdownProps, isAllActive: this.isAllActive }));
      }
    };
    this.handlePaginationGoToChange = (page) => {
      this.current = page;
    };
    this.onPageSizeSelectorChange = (pageSize) => {
      this.isAllActive = pageSize === pageSizeOptionUtils.PAGE_SIZE_ALL;
      this.pageSize = pageSizeOptionUtils.resolvePageSizeValue(pageSize, this.total);
    };
    this.calculatePages = () => {
      if (!this.total) {
        return 0;
      }
      return Math.floor((this.total - 1) / this.pageSize) + 1;
    };
    this.onPageSelectorChange = (page) => {
      this.current = page;
    };
    this.removeDuplicateItems = (extensions) => {
      const items = [...this.vegaPaginationItemTypes];
      const extensionsClone = [...extensions];
      return extensionsClone
        .map((extension) => {
        return extension.filter((item, itemIndex) => {
          const index = items.indexOf(item);
          if (index >= 0) {
            items.splice(index, 1);
            return true;
          }
          else {
            extension.splice(itemIndex, 1);
            return false;
          }
        });
      })
        .filter((arr) => arr.length > 0);
    };
    this.generateWrapperKey = (extensionArr) => {
      return extensionArr
        .map(String)
        .reduce((pre, cur) => `${pre}-${cur}`);
    };
    this.currentValueGuard = () => {
      if (this.pageCount === 0) {
        this.current = 1;
      }
      else if (this.current > this.pageCount) {
        this.current = this.pageCount;
      }
    };
  }
  /*
   * The next line is covered in e2e-test
   * @see{should-render-layout-properly-when-set-responsive-prop-layout}
   */
  /* istanbul ignore next */
  watchCurrentBreakpoint() {
  }
  watchPageCount() {
    this.currentValueGuard();
  }
  watchCurrent() {
    this.currentValueGuard();
    this.vegaChangeEventEmitter.emit(this.current);
  }
  watchTotal(newTotal) {
    if (this.isAllActive) {
      this.pageSize = newTotal;
    }
    this.pageCount = this.calculatePages();
  }
  watchPageSize() {
    this.vegaPageSizeChangeEventEmitter.emit(this.pageSize);
    this.pageCount = this.calculatePages();
  }
  watchLayout() {
  }
  componentWillLoad() {
    this.isAllActive =
      pageSizeOptionUtils.hasAllOption(this.pageSizeSelectorOptions) &&
        this.pageSize === this.total &&
        !pageSizeOptionUtils.includesPageSize(this.pageSizeSelectorOptions, this.pageSize);
    this.pageCount = this.calculatePages();
    this.currentValueGuard();
    if (!this.isAllActive && !pageSizeOptionUtils.includesPageSize(this.pageSizeSelectorOptions, this.pageSize)) {
      this.pageSizeSelectorOptions = [...this.pageSizeSelectorOptions, this.pageSize];
    }
  }
  render() {
    const currentExtensions = responsiveFormatFacade.ResponsiveFormatFacade.formatCustom(this.extensions);
    return component.sanitizeVegaComponent(index.h(index.Host, null, this.removeDuplicateItems(currentExtensions).map(this.renderPaginationItemsWrapper)), this.host);
  }
  get host() { return index.getElement(this); }
  static get watchers() { return {
    "currentBreakpoint": ["watchCurrentBreakpoint"],
    "pageCount": ["watchPageCount"],
    "current": ["watchCurrent"],
    "total": ["watchTotal"],
    "pageSize": ["watchPageSize"],
    "layout": ["watchLayout"]
  }; }
};
__decorate([
  componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
], VegaPagination.prototype, "globalSlimmers", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "translationSlimmer", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "childEventPrevent", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "childValueChangePrevent", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "vegaChangeEventEmitter", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "vegaPageSizeChangeEventEmitter", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "vegaPaginationPageSizeObserverController", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "vegaPaginationCurrentPageObserverController", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "breakpointPageResizeObserverSlimmer", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaPagination.prototype, "vegaPaginationLayoutController", void 0);
VegaPagination.style = vegaPaginationCss;

exports.vega_pagination = VegaPagination;
