import { h } from "@stencil/core";
export class SpwButton {
    constructor() {
        /** Attribut target, s'applique uniquement si href est rempli */
        this.target = '_self';
        /** Nom du bouton */
        this.name = '';
        /** Valeur du bouton */
        this.value = '';
        /** Type du bouton */
        this.type = 'button';
        /** Permet de sélectionner une variante du bouton */
        this.variant = 'primary';
        /** Permet de choisir la surface d'arrière-plan du bouton */
        this.surface = 'default';
        /** Si désactivé, le bouton n'est pas utilisable */
        this.disabled = false;
        /** Permet de spécifier la taille du bouton */
        this.size = 'medium';
        /** Si rempli, vous pouvez utiliser une référence d'icône font-awesome */
        this.isIconOnly = false;
        /** Permet de spécifier une variante de Font Awesome */
        this.iconVariant = 'fa-solid';
        /** Si vrai, le bouton prend toute la largeur */
        this.isFullWidth = false;
        /** Si vrai, le bouton prend toute la largeur en mobile */
        this.isFullWidthMobile = true;
        /** Si vrai, masque le texte en mobile (garde uniquement l'icône) */
        this.hideTextOnMobile = false;
        /** Affiche un état de chargement, désactive le bouton */
        this.isLoading = false;
        this.onFocus = () => {
            this.spwFocus.emit();
        };
        this.onBlur = () => {
            this.spwBlur.emit();
        };
        this.onClick = (ev) => {
            if (this.disabled || this.isLoading) {
                ev.preventDefault();
                return;
            }
            if (this.type === 'reset') {
                ev.preventDefault();
                this.resetForm();
                return;
            }
            if (this.type === 'submit' && !this.disabled) {
                const form = this.form ? document.getElementById(this.form) : this.el.closest('form');
                if (form) {
                    ev.preventDefault();
                    form.requestSubmit();
                    return;
                }
            }
            if (this.href !== undefined) {
                this.spwNavigate.emit(ev);
            }
        };
    }
    /** Donne le focus au bouton */
    async setFocus() {
        if (!this.nativeEl)
            return;
        this.nativeEl.classList.add('--programmatic-focus');
        this.nativeEl.focus();
        this.nativeEl.addEventListener('blur', () => {
            var _a;
            (_a = this.nativeEl) === null || _a === void 0 ? void 0 : _a.classList.remove('--programmatic-focus');
        }, { once: true });
    }
    resetForm() {
        const form = this.form ? document.getElementById(this.form) : this.el.closest('form');
        if (!form)
            return;
        form.reset();
    }
    get elementClass() {
        return {
            'spw-button': true,
            [`spw-button--${this.variant}`]: true,
            [`spw-button--surface-${this.surface}`]: true,
            [`spw-button--${this.size}`]: true,
            [`spw-button--is-icon-only`]: this.isIconOnly,
            [`spw-button--fullwidth`]: this.isFullWidth,
            [`spw-button--fullwidth-mobile`]: this.isFullWidthMobile,
            [`spw-button--hide-text-mobile`]: this.hideTextOnMobile,
            [`spw-button--loading`]: this.isLoading,
        };
    }
    render() {
        var _a;
        const { type, download, form, href, rel, target, name, value } = this;
        const TagType = this.href === undefined ? 'button' : 'a';
        const attrs = TagType === 'button'
            ? { type: type, form, name, value }
            : {
                download,
                href,
                rel,
                target,
            };
        const iconPosition = this.icon && !this.iconPosition ? 'right' : this.iconPosition;
        const iconClass = `spw-icon--${iconPosition}`;
        const iconElement = this.icon ? h("spw-icon", { variant: this.iconVariant, class: iconClass, icon: this.icon }) : null;
        const isDisabled = this.disabled;
        const slotText = ((_a = this.el.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || null;
        const ariaAttributes = {
            'aria-label': this.accAriaLabel || this.name || slotText || 'Label',
            'aria-disabled': isDisabled ? 'true' : null,
        };
        return (h(TagType, Object.assign({ key: 'af8ac1a8762a7da373014f322ee004297a8295f5' }, attrs, { ref: (el) => (this.nativeEl = el), class: this.elementClass, disabled: isDisabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick }, ariaAttributes), h("div", { key: 'dc40b975fc312377bcbdc89ee1e0da4707893b13', class: "spw-button__inner" }, h("div", { key: 'c5a397c631fd9984fca6f711b1cc890cf1516f79', class: "spw-button__inner-text" }, iconPosition === 'left' && iconElement, !this.isIconOnly && h("slot", { key: '92e532897aa0f62a2c1927026b15a7e81307256c' }), iconPosition === 'right' && iconElement)), h("spw-loading", { key: 'f7ae144bc041a0fa7d189a532a069cf7ed3e3aa5', text: "" })));
    }
    static get is() { return "spw-button"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["spw-button.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["spw-button.css"]
        };
    }
    static get properties() {
        return {
            "href": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Sp\u00E9cifie le lien si n\u00E9cessaire"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "href"
            },
            "target": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Attribut target, s'applique uniquement si href est rempli"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "target",
                "defaultValue": "'_self'"
            },
            "rel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Remplit l'attribut rel"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "rel"
            },
            "download": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Permet de t\u00E9l\u00E9charger un fichier au lieu de naviguer vers le lien"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "download"
            },
            "name": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Nom du bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "name",
                "defaultValue": "''"
            },
            "value": {
                "type": "any",
                "mutable": false,
                "complexType": {
                    "original": "string | number",
                    "resolved": "number | string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Valeur du bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "value",
                "defaultValue": "''"
            },
            "type": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'button' | 'submit' | 'reset'",
                    "resolved": "\"button\" | \"reset\" | \"submit\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Type du bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "type",
                "defaultValue": "'button'"
            },
            "form": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Fait r\u00E9f\u00E9rence \u00E0 l'id du formulaire de r\u00E9f\u00E9rence"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "form"
            },
            "variant": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'primary' | 'secondary' | 'tertiary'",
                    "resolved": "\"primary\" | \"secondary\" | \"tertiary\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Permet de s\u00E9lectionner une variante du bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "variant",
                "defaultValue": "'primary'"
            },
            "surface": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'default' | 'dark' | 'light' | 'primary'",
                    "resolved": "\"dark\" | \"default\" | \"light\" | \"primary\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Permet de choisir la surface d'arri\u00E8re-plan du bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "surface",
                "defaultValue": "'default'"
            },
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Si d\u00E9sactiv\u00E9, le bouton n'est pas utilisable"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "disabled",
                "defaultValue": "false"
            },
            "size": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'large' | 'medium' | 'small'",
                    "resolved": "\"large\" | \"medium\" | \"small\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Permet de sp\u00E9cifier la taille du bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "size",
                "defaultValue": "'medium'"
            },
            "accAriaLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Remplit l'attribut aria-label, utilis\u00E9 \u00E0 des fins d'accessibilit\u00E9"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "acc-aria-label"
            },
            "isIconOnly": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Si rempli, vous pouvez utiliser une r\u00E9f\u00E9rence d'ic\u00F4ne font-awesome"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "is-icon-only",
                "defaultValue": "false"
            },
            "icon": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Si rempli, vous pouvez utiliser une r\u00E9f\u00E9rence d'ic\u00F4ne font-awesome"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "icon"
            },
            "iconPosition": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'left' | 'right'",
                    "resolved": "\"left\" | \"right\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Position de l'ic\u00F4ne \u00E0 l'int\u00E9rieur du bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "icon-position"
            },
            "iconVariant": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'fa-solid' | 'fa-brands' | 'fa-regular' | 'fa-light'",
                    "resolved": "\"fa-brands\" | \"fa-light\" | \"fa-regular\" | \"fa-solid\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Permet de sp\u00E9cifier une variante de Font Awesome"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "icon-variant",
                "defaultValue": "'fa-solid'"
            },
            "isFullWidth": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Si vrai, le bouton prend toute la largeur"
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "is-full-width",
                "defaultValue": "false"
            },
            "isFullWidthMobile": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Si vrai, le bouton prend toute la largeur en mobile"
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "is-full-width-mobile",
                "defaultValue": "true"
            },
            "hideTextOnMobile": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Si vrai, masque le texte en mobile (garde uniquement l'ic\u00F4ne)"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "hide-text-on-mobile",
                "defaultValue": "false"
            },
            "isLoading": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Affiche un \u00E9tat de chargement, d\u00E9sactive le bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "is-loading",
                "defaultValue": "false"
            }
        };
    }
    static get events() {
        return [{
                "method": "spwFocus",
                "name": "spwFocus",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Lors du focus"
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }, {
                "method": "spwBlur",
                "name": "spwBlur",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Lors de la perte du focus"
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }, {
                "method": "spwNavigate",
                "name": "spwNavigate",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Navigation vers un lien lors du clic"
                },
                "complexType": {
                    "original": "MouseEvent",
                    "resolved": "MouseEvent",
                    "references": {
                        "MouseEvent": {
                            "location": "global",
                            "id": "global::MouseEvent"
                        }
                    }
                }
            }];
    }
    static get methods() {
        return {
            "setFocus": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "Donne le focus au bouton",
                    "tags": []
                }
            }
        };
    }
    static get elementRef() { return "el"; }
}
