import { h, Host, } from "@stencil/core";
import { capitalize, checkResizeObserver } from "../../utils/helpers";
export class PaginationBar {
    constructor() {
        this.PAGE_INPUT_FIELD_ID = "go-to-page-input";
        this.INVALID_PAGE_ERROR = "Please enter a valid page";
        this.resizeObserver = null;
        this.activePage = 1;
        this.inputError = "Please enter a valid page";
        this.itemsPerPage = 10;
        this.itemsPerPageString = "10";
        this.lowerBound = 1;
        this.paginationWrapped = false;
        /**
         * The accessible label passed down to the pagination component to provide context for screen reader users.
         */
        this.accessibleLabel = "Pagination Navigation";
        /**
         * Sets the alignment of the items in the pagination bar.
         */
        this.alignment = "right";
        /**
         * The current page number to be displayed on the pagination bar.
         */
        this.currentPage = 1;
        /**
         * If `true`, the 'All' option will be hidden from the 'items per page' select input.
         */
        this.hideAllFromItemsPerPage = false;
        /**
         * If `true`, the current page of the simple pagination will not be displayed.
         */
        this.hideCurrentPage = false;
        /**
         * If `true`, the first and last page buttons will not be displayed.
         */
        this.hideFirstAndLastPageButton = false;
        /**
         * The text which will be used in place of 'Item' on the pagination bar.
         */
        this.itemLabel = "Item";
        /**
         * If `true`, the pagination bar will display as black in the light theme, and white in dark theme.
         */
        this.monochrome = false;
        /**
         * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
         */
        this.theme = "inherit";
        /**
         * Whether the displayed pagination is simple or complex.
         */
        this.type = "simple";
        /**
         * Whether total number of items and current item range or total number of pages and current page is displayed.
         */
        this.rangeLabelType = "page";
        /**
         * The text which will be used in place of 'Page' on the pagination bar.
         */
        this.pageLabel = "Page";
        /**
         * If `true`, the 'go to page' control should be displayed.
         */
        this.showGoToPageControl = false;
        /**
         * If `true`, the number of total items and current item range or number of total pages and current page will be hidden.
         */
        this.hideRangeLabel = false;
        /**
         * If `false`, the value in the items per page control will be set immediately on ArrowUp and ArrowDown instead of when Enter is pressed.
         */
        this.selectItemsPerPageOnEnter = true;
        /**
         * If `true`, the select input to control 'items per page' should be displayed.
         */
        this.showItemsPerPageControl = false;
        /**
         If `true`, the pagination bar is set to the first page when the 'items per page' changes
         */
        this.setToFirstPageOnPaginationChange = false;
        this.setSelectedItemsPerPage = (selectedItemsPerPage, displayedItemsPerPageOptions = []) => {
            const isSelectedItemsPerPagePresent = displayedItemsPerPageOptions === null || displayedItemsPerPageOptions === void 0 ? void 0 : displayedItemsPerPageOptions.some(({ value }) => { var _a; return value === ((_a = this.selectedItemsPerPage) === null || _a === void 0 ? void 0 : _a.toString()); });
            if (isSelectedItemsPerPagePresent) {
                this.setItemsPerPage(selectedItemsPerPage, false);
            }
            else {
                console.error(`The selected items per page option "${this.selectedItemsPerPage}" does not exist`);
                this.setItemsPerPage(+this.totalItems, false);
            }
        };
        this.changeItemsPerPage = () => {
            this.setItemsPerPage(Number(this.pageDropdownEl.value));
            this.userSetItemsPerPage = Number(this.pageDropdownEl.value);
        };
        this.changePage = (page) => {
            this.activePage = page;
            this.lowerBound = page !== 1 ? (page - 1) * this.itemsPerPage + 1 : page;
            this.setUpperBound();
        };
        this.focusElFromLabel = (el) => {
            var _a, _b;
            (_b = (_a = this.paginationBarEl) === null || _a === void 0 ? void 0 : _a.querySelector(el)) === null || _b === void 0 ? void 0 : _b.setFocus();
        };
        this.goToPage = () => {
            var _a;
            const input = this.pageInputEl;
            const page = Number(input.value);
            if (page <= this.totalPages && page > 0) {
                this.changePage(page);
                (_a = this.paginationEl) === null || _a === void 0 ? void 0 : _a.setCurrentPage(page);
                this.activePage = page;
                input.value = "";
                this.icPageChange.emit({ value: page });
                this.pageInputTooltipEl.displayTooltip(false, false);
                input.validationStatus = "";
            }
            else {
                this.setInputError(input, this.INVALID_PAGE_ERROR);
            }
        };
        this.goToPageLabelClickHandler = () => {
            this.focusElFromLabel("ic-text-field");
        };
        this.handleBlur = () => {
            const textField = this.pageInputEl;
            if ((Number(textField.value) <= this.totalPages &&
                Number(textField.value) > 0) ||
                textField.value === "") {
                textField.validationStatus = "";
            }
            this.pageInputTooltipEl.displayTooltip(false, false);
        };
        this.handleFocus = () => {
            if (this.pageInputEl.validationStatus === "error") {
                this.pageInputTooltipEl.displayTooltip(true, true);
            }
        };
        this.handleInputChange = () => {
            const inputValue = parseInt(this.pageInputEl.value);
            if (inputValue > this.totalPages || inputValue <= 0) {
                this.setInputError(this.pageInputEl, this.INVALID_PAGE_ERROR);
                this.pageInputTooltipEl.displayTooltip(true, true);
            }
        };
        this.handleKeydown = (ev) => {
            if (ev.key === "Enter") {
                if (this.pageInputEl.validationStatus === "error") {
                    this.pageInputTooltipEl.displayTooltip(true, true);
                }
                else {
                    this.goToPage();
                }
            }
            else {
                this.pageInputTooltipEl.displayTooltip(false, false);
                this.pageInputEl.validationStatus = "";
            }
        };
        this.handleKeyUp = (ev) => {
            if (Number.isNaN(parseInt(this.pageInputEl.value)) &&
                ev.key !== "Backspace" &&
                ev.key !== "Enter" &&
                ev.key !== "Tab" &&
                ev.key !== "Shift") {
                this.setInputError(this.pageInputEl, "Please enter a number", false);
                this.pageInputTooltipEl.displayTooltip(true, false);
            }
        };
        this.itemsPerPageLabelClickHandler = () => {
            this.focusElFromLabel("ic-select");
        };
        this.paginationShouldWrap = () => {
            if (this.type === "simple") {
                this.paginationWrapped = this.paginationEl.clientHeight > 63;
            }
        };
        this.runResizeObserver = () => {
            if (this.paginationBarEl) {
                this.resizeObserver = new ResizeObserver(() => {
                    const { clientWidth } = this.paginationBarEl;
                    if (clientWidth - this.paginationWidth > 50 ||
                        clientWidth - this.paginationWidth < -50) {
                        this.paginationWidth = clientWidth;
                        this.paginationShouldWrap();
                    }
                });
                this.resizeObserver.observe(this.paginationBarEl);
            }
        };
        this.setInputError = (el, error, focus = true) => {
            this.inputError = error;
            el.validationStatus = "error";
            if (focus)
                el.setFocus();
        };
        this.setToFirstPage = () => {
            var _a;
            const firstPage = 1;
            this.changePage(firstPage);
            (_a = this.paginationEl) === null || _a === void 0 ? void 0 : _a.setCurrentPage(firstPage);
            this.activePage = firstPage;
            this.icPageChange.emit({ value: firstPage });
        };
        this.setItemsPerPage = (newValue, isUserAction = true) => {
            var _a;
            if (this.itemsPerPage !== newValue) {
                this.itemsPerPage = newValue;
                this.itemsPerPageString = newValue.toString();
                this.icItemsPerPageChange.emit({
                    value: this.itemsPerPage,
                    isUserAction,
                });
                if (this.setToFirstPageOnPaginationChange) {
                    this.setToFirstPage();
                }
            }
            this.totalPages =
                this.totalItems > this.itemsPerPage
                    ? Math.ceil(this.totalItems / this.itemsPerPage)
                    : 1;
            this.setUpperBound();
            if (this.activePage > this.totalPages) {
                (_a = this.paginationEl) === null || _a === void 0 ? void 0 : _a.setCurrentPage(this.totalPages);
                this.activePage = this.totalPages;
            }
            this.icPageChange.emit({ value: this.activePage, fromItemsPerPage: true });
        };
        this.setPaginationBarContent = () => {
            const clonedItemsPerPageOptions = this.itemsPerPageOptions
                ? JSON.parse(JSON.stringify(this.itemsPerPageOptions))
                : null;
            const displayedItemsPerPageOptions = clonedItemsPerPageOptions ||
                (this.totalItems <= 100
                    ? [
                        { label: "10", value: "10" },
                        { label: "25", value: "25" },
                        { label: "50", value: "50" },
                    ]
                    : [
                        { label: "25", value: "25" },
                        { label: "100", value: "100" },
                        { label: "1000", value: "1000" },
                    ]);
            !this.hideAllFromItemsPerPage &&
                displayedItemsPerPageOptions.push({
                    label: "All",
                    value: String(this.totalItems),
                });
            this.displayedItemsPerPageOptions = displayedItemsPerPageOptions.filter(({ value }) => this.totalItems >= Number(value));
            let lastOptionValue = 0;
            if (this.userSetItemsPerPage) {
                this.displayedItemsPerPageOptions.some(({ value }) => {
                    lastOptionValue = Number(value);
                    return this.userSetItemsPerPage <= lastOptionValue;
                });
                this.setItemsPerPage(lastOptionValue);
            }
            else {
                if (this.selectedItemsPerPage !== null &&
                    this.selectedItemsPerPage !== undefined) {
                    this.setSelectedItemsPerPage(this.selectedItemsPerPage, this.displayedItemsPerPageOptions);
                }
                else {
                    const updated = this.displayedItemsPerPageOptions.some(({ value }) => {
                        lastOptionValue = Number(value);
                        return this.itemsPerPage <= lastOptionValue;
                    });
                    this.setItemsPerPage(updated || (!updated && this.itemsPerPage > lastOptionValue)
                        ? lastOptionValue
                        : this.itemsPerPage, false);
                }
            }
        };
        this.setUpperBound = () => {
            this.upperBound = Math.min(this.lowerBound + this.itemsPerPage - 1, this.totalItems);
        };
    }
    watchPageNumberHandler() {
        this.setPaginationBarContent();
        if (typeof this.currentPage === "number" && this.currentPage) {
            if (this.currentPage < 1 ||
                (this.totalPages && this.currentPage > this.totalPages)) {
                console.warn(`The current page (${this.currentPage}) must be a number greater than zero but less than or equal to the total number of pages (${this.totalPages})`);
            }
            else {
                this.activePage = this.currentPage;
            }
        }
    }
    watchSelectedItemsPerPageHandler() {
        if (this.selectedItemsPerPage !== null &&
            this.selectedItemsPerPage !== undefined) {
            this.setSelectedItemsPerPage(this.selectedItemsPerPage, this.displayedItemsPerPageOptions);
        }
    }
    watchItemLabelHandler() {
        this.capitalizedItemLabel = capitalize(this.itemLabel);
        this.lowerCaseItemLabel = this.itemLabel.toLowerCase();
    }
    watchItemsPerPageOptionsHandler(newVal, oldVal) {
        if (JSON.stringify(newVal) === JSON.stringify(oldVal))
            return;
        this.setPaginationBarContent();
    }
    watchPageLabelHandler() {
        this.capitalizedPageLabel = capitalize(this.pageLabel);
        this.lowerCasePageLabel = this.pageLabel.toLowerCase();
    }
    watchTotalItemsHandler() {
        this.setPaginationBarContent();
    }
    watchSetToFirstPageOnPaginationChange() {
        this.setPaginationBarContent();
    }
    disconnectedCallback() {
        var _a;
        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
    }
    componentWillLoad() {
        this.watchPageNumberHandler();
        this.watchPageLabelHandler();
        this.watchItemLabelHandler();
        this.setPaginationBarContent();
    }
    componentDidLoad() {
        var _a, _b, _c;
        this.paginationWidth = ((_a = this.paginationBarEl) === null || _a === void 0 ? void 0 : _a.clientWidth) || 0;
        checkResizeObserver(this.runResizeObserver);
        const textField = (_b = this.el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(`.${this.PAGE_INPUT_FIELD_ID}`);
        if (textField) {
            const input = (_c = textField === null || textField === void 0 ? void 0 : textField.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector("input");
            if (input) {
                input.style.textAlign = "center";
                input.style.padding = "0";
            }
        }
        this.paginationShouldWrap();
    }
    pageChangeHandler(ev) {
        const page = ev.detail.value;
        this.changePage(page);
    }
    render() {
        const { accessibleLabel, alignment, displayedItemsPerPageOptions, PAGE_INPUT_FIELD_ID, type, rangeLabelType, hideRangeLabel, showItemsPerPageControl, showGoToPageControl, pageLabel, capitalizedPageLabel, lowerCasePageLabel, capitalizedItemLabel, lowerCaseItemLabel, totalPages, activePage, itemsPerPageString, theme, monochrome, selectItemsPerPageOnEnter, hideCurrentPage, hideFirstAndLastPageButton, } = this;
        return (h(Host, { key: 'c11938d14250e5435166136014565a78c8fbe1b0', class: { [`ic-theme-${theme}`]: theme !== "inherit" } }, h("div", { key: '14cef9faa92a11d48b0f569524f69a75924fcea5', class: {
                ["pagination-bar"]: true,
                [`pagination-bar-${alignment}`]: true,
            }, ref: (el) => (this.paginationBarEl = el) }, (!hideRangeLabel || showItemsPerPageControl) && (h("div", { key: 'ce45782788e8a0fa10c1c4be4c88dd66238abc0d', class: "item-controls" }, showItemsPerPageControl && (h("div", { key: '988fd5587d581f707c859b116c0523a09b1fc629', class: "items-per-page-holder" }, h("ic-typography", { key: '78062c53ca82dcc53fa6de6da987284760a75411', class: {
                ["items-per-page-control-label"]: true,
            }, variant: "label", onClick: this.itemsPerPageLabelClickHandler }, capitalizedItemLabel, "s per ", lowerCasePageLabel), h("ic-select", { key: '5f661cc9f2aa0f691d2e099d34531651acfd4623', theme: theme, size: "small", label: "items-per-page-input", class: "items-per-page-input", hideLabel: true, options: displayedItemsPerPageOptions, selectOnEnter: selectItemsPerPageOnEnter, value: itemsPerPageString, onIcChange: this.changeItemsPerPage, ref: (el) => (this.pageDropdownEl = el) }))), !hideRangeLabel &&
            (rangeLabelType === "data" ? (h("ic-typography", { class: {
                    ["item-pagination-label"]: true,
                }, variant: "label", "aria-live": "polite" }, this.upperBound === 0 && `0 ${lowerCaseItemLabel}s`, this.upperBound > 0 &&
                `${this.lowerBound} - ${this.upperBound} of ${this.totalItems} ${lowerCaseItemLabel}${this.totalItems > 1 ? "s" : ""}`)) : (h("ic-typography", { class: {
                    ["page-pagination-label"]: true,
                }, variant: "label", "aria-live": "polite" }, capitalizedPageLabel, " ", activePage, " of ", totalPages))))), h("div", { key: '2fe098d17de85749fb85b9da97e821c1102e30d5', class: {
                ["pagination-controls"]: true,
                ["pagination-controls-wrap"]: this.paginationWrapped,
            } }, h("div", { key: '2df84c3e3e46f8915c3cc223343af2d628025f9f', class: "pagination-holder" }, h("ic-pagination", { key: 'ad3217739a5828cbd6e438692ca5a987eab25d51', accessibleLabel: accessibleLabel, type: type, pages: totalPages, label: pageLabel, ref: (el) => (this.paginationEl = el), currentPage: activePage, theme: theme, monochrome: monochrome, hideCurrentPage: hideCurrentPage, hideFirstAndLastPageButton: hideFirstAndLastPageButton })), showGoToPageControl && (h("div", { key: '107a7b12ce7d9dd3f3ea2b62bd43c5556dfc2145', class: "go-to-page-holder" }, h("ic-typography", { key: '6042313933f74fa385a6cd5244eb32f650b3efe6', variant: "label", onClick: this.goToPageLabelClickHandler }, "Go to ", lowerCasePageLabel), h("ic-tooltip", { key: '2667de79e971e45b48b17f6479f17c34b94b9630', label: this.inputError, target: `#${PAGE_INPUT_FIELD_ID}`, disableHover: true, disableClick: true, ref: (el) => (this.pageInputTooltipEl = el) }, h("ic-text-field", { key: 'd0039eb822e6bc06d9e9c35c24c962017fffc818', theme: theme, type: "number", size: "small", label: PAGE_INPUT_FIELD_ID, class: PAGE_INPUT_FIELD_ID, id: PAGE_INPUT_FIELD_ID, hideLabel: true, onKeyDown: this.handleKeydown, onKeyUp: this.handleKeyUp, onInput: this.handleInputChange, max: totalPages, min: "1", validationInlineInternal: true, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: (el) => (this.pageInputEl = el) })), h("ic-button", { key: 'a5159ea7b8994d71d04a13e4e7dd2f778b9e6e63', variant: "secondary", onClick: this.goToPage, size: "small", class: "go-to-page-button" }, "Go")))))));
    }
    static get is() { return "ic-pagination-bar"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["ic-pagination-bar.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["ic-pagination-bar.css"]
        };
    }
    static get properties() {
        return {
            "accessibleLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The accessible label passed down to the pagination component to provide context for screen reader users."
                },
                "getter": false,
                "setter": false,
                "attribute": "accessible-label",
                "reflect": false,
                "defaultValue": "\"Pagination Navigation\""
            },
            "alignment": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcPaginationAlignmentOptions",
                    "resolved": "\"left\" | \"right\" | \"space-between\" | undefined",
                    "references": {
                        "IcPaginationAlignmentOptions": {
                            "location": "import",
                            "path": "../ic-pagination/ic-pagination.types",
                            "id": "src/components/ic-pagination/ic-pagination.types.ts::IcPaginationAlignmentOptions"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Sets the alignment of the items in the pagination bar."
                },
                "getter": false,
                "setter": false,
                "attribute": "alignment",
                "reflect": false,
                "defaultValue": "\"right\""
            },
            "currentPage": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The current page number to be displayed on the pagination bar."
                },
                "getter": false,
                "setter": false,
                "attribute": "current-page",
                "reflect": false,
                "defaultValue": "1"
            },
            "selectedItemsPerPage": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The items per page option to be selected."
                },
                "getter": false,
                "setter": false,
                "attribute": "selected-items-per-page",
                "reflect": false
            },
            "hideAllFromItemsPerPage": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the 'All' option will be hidden from the 'items per page' select input."
                },
                "getter": false,
                "setter": false,
                "attribute": "hide-all-from-items-per-page",
                "reflect": false,
                "defaultValue": "false"
            },
            "hideCurrentPage": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the current page of the simple pagination will not be displayed."
                },
                "getter": false,
                "setter": false,
                "attribute": "hide-current-page",
                "reflect": false,
                "defaultValue": "false"
            },
            "hideFirstAndLastPageButton": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the first and last page buttons will not be displayed."
                },
                "getter": false,
                "setter": false,
                "attribute": "hide-first-and-last-page-button",
                "reflect": false,
                "defaultValue": "false"
            },
            "itemLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The text which will be used in place of 'Item' on the pagination bar."
                },
                "getter": false,
                "setter": false,
                "attribute": "item-label",
                "reflect": false,
                "defaultValue": "\"Item\""
            },
            "itemsPerPageOptions": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "{\n    label: string;\n    value: string;\n  }[]",
                    "resolved": "undefined | { label: string; value: string; }[]",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The options which will be displayed for 'items per page' select input."
                },
                "getter": false,
                "setter": false
            },
            "monochrome": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the pagination bar will display as black in the light theme, and white in dark theme."
                },
                "getter": false,
                "setter": false,
                "attribute": "monochrome",
                "reflect": false,
                "defaultValue": "false"
            },
            "theme": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcThemeMode",
                    "resolved": "\"dark\" | \"inherit\" | \"light\" | undefined",
                    "references": {
                        "IcThemeMode": {
                            "location": "import",
                            "path": "../../utils/types",
                            "id": "src/utils/types.ts::IcThemeMode"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component."
                },
                "getter": false,
                "setter": false,
                "attribute": "theme",
                "reflect": false,
                "defaultValue": "\"inherit\""
            },
            "type": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcPaginationTypes",
                    "resolved": "\"complex\" | \"simple\" | undefined",
                    "references": {
                        "IcPaginationTypes": {
                            "location": "import",
                            "path": "../ic-pagination/ic-pagination.types",
                            "id": "src/components/ic-pagination/ic-pagination.types.ts::IcPaginationTypes"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Whether the displayed pagination is simple or complex."
                },
                "getter": false,
                "setter": false,
                "attribute": "type",
                "reflect": false,
                "defaultValue": "\"simple\""
            },
            "rangeLabelType": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcPaginationLabelTypes",
                    "resolved": "\"data\" | \"page\" | undefined",
                    "references": {
                        "IcPaginationLabelTypes": {
                            "location": "import",
                            "path": "../ic-pagination/ic-pagination.types",
                            "id": "src/components/ic-pagination/ic-pagination.types.ts::IcPaginationLabelTypes"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Whether total number of items and current item range or total number of pages and current page is displayed."
                },
                "getter": false,
                "setter": false,
                "attribute": "range-label-type",
                "reflect": false,
                "defaultValue": "\"page\""
            },
            "pageLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The text which will be used in place of 'Page' on the pagination bar."
                },
                "getter": false,
                "setter": false,
                "attribute": "page-label",
                "reflect": false,
                "defaultValue": "\"Page\""
            },
            "showGoToPageControl": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the 'go to page' control should be displayed."
                },
                "getter": false,
                "setter": false,
                "attribute": "show-go-to-page-control",
                "reflect": false,
                "defaultValue": "false"
            },
            "hideRangeLabel": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the number of total items and current item range or number of total pages and current page will be hidden."
                },
                "getter": false,
                "setter": false,
                "attribute": "hide-range-label",
                "reflect": false,
                "defaultValue": "false"
            },
            "selectItemsPerPageOnEnter": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `false`, the value in the items per page control will be set immediately on ArrowUp and ArrowDown instead of when Enter is pressed."
                },
                "getter": false,
                "setter": false,
                "attribute": "select-items-per-page-on-enter",
                "reflect": false,
                "defaultValue": "true"
            },
            "showItemsPerPageControl": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the select input to control 'items per page' should be displayed."
                },
                "getter": false,
                "setter": false,
                "attribute": "show-items-per-page-control",
                "reflect": false,
                "defaultValue": "false"
            },
            "totalItems": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Total number of items to be displayed across all pages."
                },
                "getter": false,
                "setter": false,
                "attribute": "total-items",
                "reflect": false
            },
            "setToFirstPageOnPaginationChange": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the pagination bar is set to the first page when the 'items per page' changes"
                },
                "getter": false,
                "setter": false,
                "attribute": "set-to-first-page-on-pagination-change",
                "reflect": false,
                "defaultValue": "false"
            }
        };
    }
    static get states() {
        return {
            "capitalizedItemLabel": {},
            "capitalizedPageLabel": {},
            "activePage": {},
            "displayedItemsPerPageOptions": {},
            "inputError": {},
            "itemsPerPage": {},
            "itemsPerPageString": {},
            "lowerBound": {},
            "lowerCaseItemLabel": {},
            "lowerCasePageLabel": {},
            "paginationWidth": {},
            "paginationWrapped": {},
            "totalPages": {},
            "upperBound": {}
        };
    }
    static get events() {
        return [{
                "method": "icPageChange",
                "name": "icPageChange",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when a page is navigated to via the 'go to' input.\nThe `detail` property contains `value` (i.e. the page number) and a `fromItemsPerPage` flag to indicate if the event was triggered by the `icItemsPerPageChange` event also occurring."
                },
                "complexType": {
                    "original": "IcPageChangeEventDetail",
                    "resolved": "IcPageChangeEventDetail",
                    "references": {
                        "IcPageChangeEventDetail": {
                            "location": "import",
                            "path": "./ic-pagination-bar.types",
                            "id": "src/components/ic-pagination-bar/ic-pagination-bar.types.ts::IcPageChangeEventDetail"
                        }
                    }
                }
            }, {
                "method": "icItemsPerPageChange",
                "name": "icItemsPerPageChange",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the items per page option is changed."
                },
                "complexType": {
                    "original": "IcItemsPerPageChangeEventDetail",
                    "resolved": "IcItemsPerPageChangeEventDetail",
                    "references": {
                        "IcItemsPerPageChangeEventDetail": {
                            "location": "import",
                            "path": "./ic-pagination-bar.types",
                            "id": "src/components/ic-pagination-bar/ic-pagination-bar.types.ts::IcItemsPerPageChangeEventDetail"
                        }
                    }
                }
            }];
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "currentPage",
                "methodName": "watchPageNumberHandler"
            }, {
                "propName": "selectedItemsPerPage",
                "methodName": "watchSelectedItemsPerPageHandler"
            }, {
                "propName": "itemLabel",
                "methodName": "watchItemLabelHandler"
            }, {
                "propName": "itemsPerPageOptions",
                "methodName": "watchItemsPerPageOptionsHandler"
            }, {
                "propName": "pageLabel",
                "methodName": "watchPageLabelHandler"
            }, {
                "propName": "totalItems",
                "methodName": "watchTotalItemsHandler"
            }, {
                "propName": "setToFirstPageOnPaginationChange",
                "methodName": "watchSetToFirstPageOnPaginationChange"
            }];
    }
    static get listeners() {
        return [{
                "name": "icPageChange",
                "method": "pageChangeHandler",
                "target": undefined,
                "capture": false,
                "passive": false
            }];
    }
}
//# sourceMappingURL=ic-pagination-bar.js.map
