import { Host, h } from "@stencil/core";
export class SpwSelect {
    constructor() {
        /** Label associé au champ de sélection */
        this.label = '';
        /** Texte du placeholder à afficher lorsque rien n'est sélectionné */
        this.placeholder = 'Sélectionner une option';
        /** Indique si la sélection est obligatoire dans le formulaire */
        this.required = false;
        /** Taille du champ de sélection : 'large' ou 'medium' */
        this.size = 'medium';
        /** Message d'erreur à afficher sous le champ de sélection */
        this.error = '';
        /** Message d'indication (hint) à afficher sous le champ de sélection */
        this.hint = '';
        /** Message de succès à afficher sous le champ de sélection */
        this.success = '';
        /** Message de warning à afficher sous le champ */
        this.warning = '';
        /** Affiche une icône d'erreur si vrai */
        this.showErrorIcon = true;
        /** Affiche une icône d'indication si vrai */
        this.showHintIcon = true;
        /** Affiche une icône de succès si vrai */
        this.showSuccessIcon = true;
        /** Affiche une icône de warning si vrai */
        this.showWarningIcon = true;
        /** Positionnement du tooltip */
        this.tooltipDirection = 'top';
        /** Curseur du tooltip */
        this.tooltipCursor = 'help';
        /** Indique si le champ peut être effacé avec un bouton */
        this.isClear = false;
        this.defaultValue = null;
    }
    handleItemsChange() {
        if (this.selectElement) {
            this.syncDynamicOptions();
        }
    }
    handleValueChange(newValue) {
        if (this.internalValue !== newValue) {
            this.internalValue = newValue;
            if (this.selectElement) {
                this.selectElement.value = String(newValue !== null && newValue !== void 0 ? newValue : '');
            }
            this.internals.setFormValue(this.getFormValue());
        }
    }
    /** Réinitialise le champ de sélection */
    async resetSelect() {
        this.internalValue = '';
        this.value = '';
        if (this.selectElement) {
            this.selectElement.value = '';
        }
        this.internals.setFormValue('');
        this.valueChanged.emit('');
    }
    /** Définit la valeur du champ de sélection */
    async setValue(val) {
        this.internalValue = val;
        this.value = val;
        if (this.selectElement) {
            this.selectElement.value = String(val);
        }
        this.internals.setFormValue(this.getFormValue());
        this.valueChanged.emit(this.internalValue);
    }
    /** Récupère la valeur actuelle du champ de sélection */
    async getValue() {
        return this.internalValue;
    }
    componentWillLoad() {
        var _a;
        this.defaultValue = (_a = this.value) !== null && _a !== void 0 ? _a : this.getInitialSelectedValue();
        this.internalValue = this.value || this.getInitialSelectedValue();
    }
    componentDidLoad() {
        this.internals.setFormValue(this.getFormValue());
        if (!this.items) {
            this.moveOptionsToLightDom();
        }
        else {
            this.syncDynamicOptions();
        }
    }
    formResetCallback() {
        var _a;
        this.setValue((_a = this.defaultValue) !== null && _a !== void 0 ? _a : '');
    }
    getFormValue() {
        return this.internalValue ? String(this.internalValue) : null;
    }
    getInitialSelectedValue() {
        if (this.items && this.items.length > 0) {
            return null;
        }
        const assignedNodes = Array.from(this.el.querySelectorAll('option'));
        for (const option of assignedNodes) {
            if (option.hasAttribute('selected')) {
                return option.getAttribute('value');
            }
        }
        return null;
    }
    handleSelectChange(event) {
        const select = event.target;
        this.internalValue = select.value;
        this.value = this.internalValue;
        this.internals.setFormValue(this.getFormValue());
        this.valueChanged.emit(this.internalValue);
    }
    moveOptionsToLightDom() {
        const slot = this.el.shadowRoot.querySelector('slot');
        if (slot) {
            const assignedNodes = slot.assignedNodes({ flatten: true });
            assignedNodes.forEach(node => {
                if (node.nodeName === 'OPTION' || node.nodeName === 'OPTGROUP') {
                    this.selectElement.appendChild(node);
                }
            });
        }
    }
    syncDynamicOptions() {
        while (this.selectElement.options.length > 1) {
            this.selectElement.remove(1);
        }
        if (this.items && this.items.length > 0) {
            this.items.forEach(item => {
                const option = document.createElement('option');
                const value = this.itemValue ? item[this.itemValue] : item;
                const label = this.itemLabel ? item[this.itemLabel] : item;
                const disabled = item.disabled || false;
                option.value = String(value);
                option.textContent = String(label);
                option.disabled = disabled;
                this.selectElement.appendChild(option);
            });
        }
        if (this.selectElement.value !== String(this.internalValue || '')) {
            this.selectElement.value = String(this.internalValue || '');
        }
    }
    renderErrorMessage() {
        if (this.error) {
            return (h("spw-field-message", { variant: "error", showIcon: this.showErrorIcon }, this.error));
        }
    }
    renderHintMessage() {
        if (this.hint) {
            return (h("spw-field-message", { variant: "hint", showIcon: this.showHintIcon }, this.hint));
        }
    }
    renderSuccessMessage() {
        if (this.success) {
            return (h("spw-field-message", { variant: "success", showIcon: this.showSuccessIcon }, this.success));
        }
    }
    renderWarningMessage() {
        if (this.warning) {
            return (h("spw-field-message", { variant: "warning", showIcon: this.showWarningIcon }, this.warning));
        }
    }
    handleClear(event) {
        event.stopPropagation();
        this.resetSelect();
    }
    get elementClass() {
        return {
            'spw-select': true,
            [`spw-select--${this.size}`]: true,
            'spw-select--disabled': this.disabled,
            'spw-select--is-error': !!this.error,
            'spw-select--is-clear': this.isClear && !!this.internalValue,
        };
    }
    render() {
        return (h(Host, { key: '81b442a4a808d22e864b0ae86e596394ed2e4138' }, h("div", { key: 'ec9981cddfe018e48fd37e891826c2057d6b06b7', class: this.elementClass }, this.label && (h("spw-field-label", { key: 'ed31b2aea9498dd32a89b3bb67759cfa76620201', label: this.label, name: this.name, required: this.required, tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, tooltipMaxWidth: this.tooltipMaxWidth, tooltipDirection: this.tooltipDirection, tooltipCursor: this.tooltipCursor })), this.assistiveText && (h("spw-field-message", { key: '0515f6a86938f9df94e35a184501fe1cb1b911ad', class: "spw-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: 'dcea546070211670b8e1af0b6e97c1564f7e8bd0', class: "spw-select__container" }, h("select", { key: '44a6c19e9b485fb11ca13137f339ddf97e3fcd61', id: this.name, name: this.name, "aria-label": this.accAriaLabel || this.label || this.name, class: "spw-select__trigger", onChange: event => this.handleSelectChange(event), disabled: this.disabled, ref: el => (this.selectElement = el), tabindex: this.disabled ? -1 : 0 }, h("option", { key: '0126406f9e6b9046c86063eadc283278266f36d6', value: "", disabled: true, selected: !this.internalValue }, this.placeholder)), h("div", { key: '9743ab039baf9d35591681f3767bbee018257d56', class: "spw-select__icons" }, this.isClear && !!this.internalValue && (h("span", { key: '3779eea44d77795a42eb030dda1af776c5f02b9c', class: "spw-select__clear", onClick: event => this.handleClear(event) }, h("spw-icon", { key: 'b22e5e2aa2c81eeb1f0c34fbeaadba4f9f8e4827', icon: "fa-xmark" }))), h("spw-icon", { key: 'd9631b9b8f57f3e9184fdca81de6e83fcf5cd343', class: "spw-select__arrow", icon: "fa-chevron-down" }))), !this.items && h("slot", { key: '35913f6a392f1f7ec0d2794c5253054df88ee421' })), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
    }
    static get is() { return "spw-select"; }
    static get encapsulation() { return "shadow"; }
    static get formAssociated() { return true; }
    static get originalStyleUrls() {
        return {
            "$": ["spw-select.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["spw-select.css"]
        };
    }
    static get properties() {
        return {
            "value": {
                "type": "any",
                "mutable": true,
                "complexType": {
                    "original": "string | number",
                    "resolved": "number | string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Valeur s\u00E9lectionn\u00E9e actuelle, mutable et refl\u00E9t\u00E9e dans le DOM"
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "value"
            },
            "label": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Label associ\u00E9 au champ de s\u00E9lection"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "label",
                "defaultValue": "''"
            },
            "placeholder": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Texte du placeholder \u00E0 afficher lorsque rien n'est s\u00E9lectionn\u00E9"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "placeholder",
                "defaultValue": "'S\u00E9lectionner une option'"
            },
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Indique si le champ de s\u00E9lection est d\u00E9sactiv\u00E9"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "disabled"
            },
            "name": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Nom de l'\u00E9l\u00E9ment utilis\u00E9 dans les formulaires pour associer la valeur s\u00E9lectionn\u00E9e"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "name"
            },
            "required": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Indique si la s\u00E9lection est obligatoire dans le formulaire"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "required",
                "defaultValue": "false"
            },
            "size": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'large' | 'medium'",
                    "resolved": "\"large\" | \"medium\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Taille du champ de s\u00E9lection : 'large' ou 'medium'"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "size",
                "defaultValue": "'medium'"
            },
            "assistiveText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Texte d'assistance affich\u00E9 sous le label"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "assistive-text"
            },
            "error": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Message d'erreur \u00E0 afficher sous le champ de s\u00E9lection"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "error",
                "defaultValue": "''"
            },
            "hint": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Message d'indication (hint) \u00E0 afficher sous le champ de s\u00E9lection"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "hint",
                "defaultValue": "''"
            },
            "success": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Message de succ\u00E8s \u00E0 afficher sous le champ de s\u00E9lection"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "success",
                "defaultValue": "''"
            },
            "warning": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Message de warning \u00E0 afficher sous le champ"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "warning",
                "defaultValue": "''"
            },
            "showErrorIcon": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Affiche une ic\u00F4ne d'erreur si vrai"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "show-error-icon",
                "defaultValue": "true"
            },
            "showHintIcon": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Affiche une ic\u00F4ne d'indication si vrai"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "show-hint-icon",
                "defaultValue": "true"
            },
            "showSuccessIcon": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Affiche une ic\u00F4ne de succ\u00E8s si vrai"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "show-success-icon",
                "defaultValue": "true"
            },
            "showWarningIcon": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Affiche une ic\u00F4ne de warning si vrai"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "show-warning-icon",
                "defaultValue": "true"
            },
            "items": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "SelectItem[]",
                    "resolved": "SelectItem[]",
                    "references": {
                        "SelectItem": {
                            "location": "local",
                            "path": "/Users/pectonite/Desktop/SPW/spw-design-system/packages/spw-stencil-library/src/components/spw-select/spw-select.tsx",
                            "id": "src/components/spw-select/spw-select.tsx::SelectItem"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Liste d'items dynamiques pour g\u00E9n\u00E9rer les options (array d'objects avec label + value)"
                },
                "getter": false,
                "setter": false
            },
            "itemLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Propri\u00E9t\u00E9 \u00E0 utiliser comme label des options"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "item-label"
            },
            "itemValue": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Propri\u00E9t\u00E9 \u00E0 utiliser comme valeur des options"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "item-value"
            },
            "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"
            },
            "tooltipTitle": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Titre du tooltip"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "tooltip-title"
            },
            "tooltipText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Texte du tooltip"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "tooltip-text"
            },
            "tooltipMaxWidth": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Largeur maximale du tooltip"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "tooltip-max-width"
            },
            "tooltipDirection": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'top' | 'bottom' | 'left' | 'right'",
                    "resolved": "\"bottom\" | \"left\" | \"right\" | \"top\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Positionnement du tooltip"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "tooltip-direction",
                "defaultValue": "'top'"
            },
            "tooltipCursor": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'pointer' | 'default' | 'help' | 'disabled'",
                    "resolved": "\"default\" | \"disabled\" | \"help\" | \"pointer\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Curseur du tooltip"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "tooltip-cursor",
                "defaultValue": "'help'"
            },
            "isClear": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Indique si le champ peut \u00EAtre effac\u00E9 avec un bouton"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "is-clear",
                "defaultValue": "false"
            }
        };
    }
    static get states() {
        return {
            "internalValue": {}
        };
    }
    static get events() {
        return [{
                "method": "valueChanged",
                "name": "valueChanged",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emet un event si la valeur change"
                },
                "complexType": {
                    "original": "string | number",
                    "resolved": "number | string",
                    "references": {}
                }
            }];
    }
    static get methods() {
        return {
            "resetSelect": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "R\u00E9initialise le champ de s\u00E9lection",
                    "tags": []
                }
            },
            "setValue": {
                "complexType": {
                    "signature": "(val: string | number) => Promise<void>",
                    "parameters": [{
                            "name": "val",
                            "type": "string | number",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "D\u00E9finit la valeur du champ de s\u00E9lection",
                    "tags": []
                }
            },
            "getValue": {
                "complexType": {
                    "signature": "() => Promise<string | number>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<string | number>"
                },
                "docs": {
                    "text": "R\u00E9cup\u00E8re la valeur actuelle du champ de s\u00E9lection",
                    "tags": []
                }
            }
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "items",
                "methodName": "handleItemsChange"
            }, {
                "propName": "value",
                "methodName": "handleValueChange"
            }];
    }
    static get attachInternalsMemberName() { return "internals"; }
}
