import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host } from './index-Co4V4Zk-.js';

const spwPaginationCss = () => `html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:var(--spw-ds-font-main)}body{margin:0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-pagination__item--dots,.spw-pagination__item button{text-align:center;line-height:32px;font-weight:700;border-radius:32px;font-size:14px;min-width:32px;height:32px}.spw-pagination__item--dots:focus-visible,.spw-pagination__item button:focus-visible{outline:3px solid white;outline-offset:-1px;box-shadow:0 0 0 5px black}.spw-pagination{display:flex;flex-direction:column;align-items:center}@media (min-width: 768px){.spw-pagination{align-items:flex-start}}.spw-pagination ul{display:flex;align-items:center;padding:0}.spw-pagination__item{margin-right:12px}.spw-pagination__item spw-icon{font-size:18px}.spw-pagination__item button{padding:0 6px;margin:0;border:none;cursor:pointer;color:var(--spw-color-themes-grey-grey-900);background:none}.spw-pagination__item:not(.spw-pagination__item--active,.spw-pagination__item--dots,.spw-pagination__item--disabled):hover button{background:var(--spw-color-themes-grey-grey-200)}.spw-pagination__item:not(.spw-pagination__item--active,.spw-pagination__item--dots,.spw-pagination__item--disabled):active button{background:var(--spw-color-themes-grey-grey-300)}.spw-pagination__item--arrow button{padding:0 12px;display:flex;gap:8px;align-items:center;text-decoration:underline}.spw-pagination__item--arrow button:hover{text-decoration:none}.spw-pagination__item--dots{position:relative;top:3px;display:inline-flex;align-items:center;justify-content:center;cursor:default;background:none;color:var(--spw-color-themes-grey-grey-400)}.spw-pagination__item--dots spw-icon{font-size:16px}.spw-pagination__item--desktop{display:none}@media (min-width: 768px){.spw-pagination__item--desktop{display:inline-block}}.spw-pagination__item--active button{color:white;background:var(--spw-ds-primary)}.spw-pagination__input spw-text-field{width:36px;--spw-input-height:32px;--spw-input-padding:0 4px;--spw-input-text-align:center;--spw-input-font-size:14px}.spw-pagination__mobile-arrows{margin-top:12px}@media (min-width: 768px){.spw-pagination__mobile-arrows{display:none !important}}.spw-pagination__total-pages{font-size:14px;margin:0 12px 0 6px}`;

const SpwPagination = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.pageChanged = createEvent(this, "pageChanged", 7);
        /** Indique si la pagination est désactivée */
        this.isDisabled = false;
        /** Type de variante de la pagination : 'numbers' ou 'input' */
        this.variant = 'numbers';
        /** Page actuellement sélectionnée, mutable */
        this.currentPage = 1;
        /** Texte pour le bouton "suivant" */
        this.nextButtonText = 'Suivant';
        /** Texte pour le bouton "précédent" */
        this.previousButtonText = 'Précédent';
        /** Mode de pagination : true = changement interne de page, false = émission d'événement uniquement */
        this.isDynamic = true;
        this.inputPageValue = '';
        this.isMobile = window.innerWidth < 800;
        this.updateIsMobile = () => {
            this.isMobile = window.innerWidth < 800;
        };
    }
    componentWillLoad() {
        this.calculateTotalPages();
        this.inputPageValue = this.currentPage.toString();
        window.addEventListener('resize', this.updateIsMobile);
    }
    disconnectedCallback() {
        window.removeEventListener('resize', this.updateIsMobile);
    }
    calculateTotalPages() {
        this.totalPages = Math.ceil(this.totalItems / this.itemsPerPage);
    }
    onCurrentPageChange(newPage) {
        this.inputPageValue = newPage.toString();
    }
    onItemsPerPageChange() {
        this.currentPage = 1;
        this.pageChanged.emit(this.currentPage);
    }
    onTotalItemsChange() {
        if (!this.totalItems || this.totalItems <= 0) {
            return;
        }
        const newTotalPages = Math.ceil(this.totalItems / this.itemsPerPage);
        if (this.currentPage > newTotalPages) {
            this.currentPage = newTotalPages;
            this.pageChanged.emit(this.currentPage);
        }
    }
    /** Méthode publique pour définir la page courante */
    async setPage(page) {
        this.goToPage(page);
    }
    goToPage(page) {
        if (page !== this.currentPage && !this.isDisabled && page >= 1 && page <= this.totalPages) {
            if (this.isDynamic) {
                this.currentPage = page;
            }
            this.pageChanged.emit(page);
        }
    }
    handleInputChange(event) {
        const inputValue = event.target.value;
        this.inputPageValue = inputValue;
        const page = parseInt(inputValue, 10);
        if (!isNaN(page) && page >= 1 && page <= this.totalPages) {
            clearTimeout(this.debounceTimer);
            this.debounceTimer = setTimeout(() => {
                this.goToPage(page);
            }, 500);
        }
    }
    getPaginationClass() {
        var _a, _b;
        const pages = this.calculatePageRange();
        const ellipsisCount = pages.filter(({ page }) => page === '...').length;
        const hasEllipsisStart = ellipsisCount > 0 && ((_a = pages[1]) === null || _a === void 0 ? void 0 : _a.page) === '...';
        const hasEllipsisEnd = ellipsisCount > 0 && ((_b = pages[pages.length - 2]) === null || _b === void 0 ? void 0 : _b.page) === '...';
        let paginationClass = `spw-pagination spw-pagination--${this.currentPage} spw-pagination--total-${this.totalPages}`;
        if (ellipsisCount === 2) {
            paginationClass += ' spw-pagination--double-ellipsis';
        }
        else if (hasEllipsisStart) {
            paginationClass += ' spw-pagination--ellipsis-start';
        }
        else if (hasEllipsisEnd) {
            paginationClass += ' spw-pagination--ellipsis-end';
        }
        return paginationClass;
    }
    handleKeyDown(event) {
        if (event.key === 'Enter') {
            const page = parseInt(this.inputPageValue, 10);
            if (!isNaN(page)) {
                this.goToPage(page);
            }
        }
    }
    calculatePageRange() {
        const pages = [];
        const { currentPage, totalPages, isMobile } = this;
        if (isMobile) {
            // Mode mobile
            if (totalPages <= 5) {
                for (let i = 1; i <= totalPages; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--small-range' });
                }
            }
            else if (currentPage <= 3) {
                for (let i = 1; i <= 3; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--start-range' });
                }
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
            }
            else if (currentPage >= totalPages - 2) {
                pages.push({ page: 1, class: 'spw-pagination__item--start' });
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                for (let i = totalPages - 2; i <= totalPages; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--end-range' });
                }
            }
            else {
                pages.push({ page: 1, class: 'spw-pagination__item--start' });
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                for (let i = currentPage - 1; i <= currentPage + 1; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--middle-range' });
                }
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
            }
        }
        else {
            // Mode desktop
            if (totalPages <= 7) {
                for (let i = 1; i <= totalPages; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--small-range' });
                }
            }
            else if (currentPage <= 4) {
                for (let i = 1; i <= 4; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--start-range' });
                }
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
            }
            else if (currentPage >= totalPages - 3) {
                pages.push({ page: 1, class: 'spw-pagination__item--start' });
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                for (let i = totalPages - 3; i <= totalPages; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--end-range' });
                }
            }
            else {
                pages.push({ page: 1, class: 'spw-pagination__item--start' });
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                for (let i = currentPage - 2; i <= currentPage + 2; i++) {
                    pages.push({ page: i, class: 'spw-pagination__item--middle-range' });
                }
                pages.push({ page: '...', class: 'spw-pagination__item--ellipsis' });
                pages.push({ page: totalPages, class: 'spw-pagination__item--end' });
            }
        }
        return pages;
    }
    render() {
        const pages = this.calculatePageRange();
        const showPrevArrow = this.currentPage > 1;
        const showNextArrow = this.currentPage < this.totalPages;
        const prevArrow = showPrevArrow && (h("li", { key: 'dcd1498e29ee3fb0a7aacfcf837cf779941390c0', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: 'b15634e85c1082de7220d634d703583cfe000cc0', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: 'e15c7fd09d198cced97501c8eeac814e6c72e45e', icon: "fa-chevron-left" }), " ", h("span", { key: '417047243b0821163a0e107fb5f810c60758a899', class: "spw-pagination__item-arrow-text" }, this.previousButtonText))));
        const nextArrow = showNextArrow && (h("li", { key: 'dfad6e553a19c22f6f7ecca0a0c0b41a190370a9', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: '278d707a4394e2225cf6c9bf50ae1146b54914fd', onClick: () => this.goToPage(this.currentPage + 1) }, h("span", { key: '47b58d5f383d2aee5335ce3e3520593ae6b8fdc1', class: "spw-pagination__item-arrow-text" }, this.nextButtonText), " ", h("spw-icon", { key: 'aaeb333a63ce999845ff481283d65d359b498626', icon: "fa-chevron-right" }))));
        const prevArrowMobile = this.currentPage > 1 && (h("li", { key: '67d470dd7ec978d778bf9501f7ff4f0d53e8fd74', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '1ef874caef38ad58bfef892f7ff3d3c6a92f1e13', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: '615092ac9a6fd45d24fba1625ff16f5ab83bcd08', icon: "fa-chevron-left" }), " ", h("span", { key: '68890a0dc95b5356e08002ecd2e8917f024ea2dd' }, this.previousButtonText))));
        const nextArrowMobile = this.currentPage < this.totalPages && (h("li", { key: 'b3ec5c4edbbf33b3c3597e2e8269d390cdf13f3d', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '183cf1b1d5d6a92f7738674e3d2e9cb7f060af57', onClick: () => this.goToPage(this.currentPage + 1), disabled: this.currentPage >= this.totalPages }, h("span", { key: '7dfbc497fa94d90984af376e5e20a46621ef4402' }, this.nextButtonText), " ", h("spw-icon", { key: '0aa1fef8996bf23df1eda494cb8f1d9ef6a857b9', icon: "fa-chevron-right" }))));
        const mobileArrows = (h("ul", { key: 'bb0d46915afe5a30ed9751d858a7046a026d0ff4', class: "spw-pagination__mobile-arrows" }, prevArrowMobile, nextArrowMobile));
        return (h(Host, { key: '044cde627233453d74e4a55bfea69d8199513b72' }, h("div", { key: '7e49988f7e2331a3b986cb9644fb51b5e3e25997', class: this.getPaginationClass() }, this.variant === 'input' && (h(Fragment, { key: '721f2508e7980a7d017d57bd35571bea3d7e7478' }, h("ul", { key: 'ed8562aa281db341405e2d7a7374e1890e63ae16' }, prevArrow, h("li", { key: '0f0a0a41bc898e82c1293d59892a2278de1f3e2a', class: "spw-pagination__input" }, h("spw-text-field", { key: '09eb4b0c43e1bc8b0d598d5144bf8defcf772f4b', value: this.inputPageValue, type: "text", name: "pagination-input", onInput: event => this.handleInputChange(event), onKeyDown: event => this.handleKeyDown(event), disabled: this.isDisabled })), h("li", { key: '638c548a6d33678719f9c9543eb3b99a9b52a7d9', class: "spw-pagination__total-pages" }, "sur ", this.totalPages, " ", this.totalPages === 1 ? 'page' : 'pages'), nextArrow), mobileArrows)), this.variant === 'numbers' && (h(Fragment, { key: 'a88d47012d933c68cb648223cf0e2de3e0b4b1e5' }, h("ul", { key: '88d35c75e74693c3cefc806a9592bbf96103add8' }, prevArrow, pages.map(({ page, class: pageClass }) => {
            if (page === '...') {
                return (h("li", { class: `spw-pagination__item spw-pagination__item--dots ${pageClass}` }, h("spw-icon", { icon: "fa-ellipsis" })));
            }
            return (h("li", { class: {
                    'spw-pagination__item': true,
                    'spw-pagination__item--active': page === this.currentPage,
                    [pageClass]: true,
                } }, h("button", { onClick: () => this.goToPage(page), disabled: page === this.currentPage }, page)));
        }), nextArrow), mobileArrows)))));
    }
    static get watchers() { return {
        "totalItems": [{
                "calculateTotalPages": 0
            }, {
                "onTotalItemsChange": 0
            }],
        "itemsPerPage": [{
                "calculateTotalPages": 0
            }, {
                "onItemsPerPageChange": 0
            }],
        "currentPage": [{
                "calculateTotalPages": 0
            }, {
                "onCurrentPageChange": 0
            }]
    }; }
};
SpwPagination.style = spwPaginationCss();

export { SpwPagination as spw_pagination };
