var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
    if (kind === "a" && !f)
        throw new TypeError("Private accessor was defined without a getter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
        throw new TypeError("Cannot read private member from an object whose class did not declare it");
    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
    if (kind === "m")
        throw new TypeError("Private method is not writable");
    if (kind === "a" && !f)
        throw new TypeError("Private accessor was defined without a setter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
        throw new TypeError("Cannot write private member to an object whose class did not declare it");
    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var _GxIdeSelectUserTeam_componentLocale, _GxIdeSelectUserTeam_userTeamsModel, _GxIdeSelectUserTeam_chSelectTeamEl, _GxIdeSelectUserTeam_displayTeamsTransitionTime, _GxIdeSelectUserTeam_continueHandler, _GxIdeSelectUserTeam_cancelHandler;
// Stencil
import { Host, h, getAssetPath } from "@stencil/core";
// Custom Imports
import { Locale } from "../../common/locale";
import { mapTeamsToComboBoxItemModel } from "./helpers";
const COPYRIGHTS_ILLUSTRATION = getAssetPath(`./gx-ide-assets/welcome-page/images/copyrights-illustration.png`);
const ICON_NEXT = getAssetPath(`./gx-ide-assets/welcome-page/images/icon-next.svg`);
const CSS_BUNDLES = [
    "resets/box-sizing",
    "utils/typography",
    "components/button",
    "components/combo-box"
];
export class GxIdeSelectUserTeam {
    constructor() {
        /**
         * The component hard-coded strings translations.
         */
        // eslint-disable-next-line @stencil-community/own-props-must-be-private
        _GxIdeSelectUserTeam_componentLocale.set(this, void 0);
        // Select User Team References :
        _GxIdeSelectUserTeam_userTeamsModel.set(this, []);
        _GxIdeSelectUserTeam_chSelectTeamEl.set(this, void 0);
        _GxIdeSelectUserTeam_displayTeamsTransitionTime.set(this, 100);
        _GxIdeSelectUserTeam_continueHandler.set(this, async () => {
            await this.continueCallback(__classPrivateFieldGet(this, _GxIdeSelectUserTeam_chSelectTeamEl, "f").value);
        });
        _GxIdeSelectUserTeam_cancelHandler.set(this, async () => {
            await this.cancelCallback();
        });
        this.slideIsVisible = false;
        this.teamsModelReady = false;
        this.cancelCallback = undefined;
        this.continueCallback = undefined;
        this.teams = undefined;
    }
    teamsChanged(newTeams) {
        this.slideIsVisible = false;
        // switch step
        setTimeout(() => {
            if (newTeams.length) {
                __classPrivateFieldSet(this, _GxIdeSelectUserTeam_userTeamsModel, mapTeamsToComboBoxItemModel(newTeams), "f");
                this.teamsModelReady = true;
            }
            else {
                this.teamsModelReady = false;
            }
        }, __classPrivateFieldGet(this, _GxIdeSelectUserTeam_displayTeamsTransitionTime, "f"));
        // show slide
        setTimeout(() => {
            this.slideIsVisible = true;
        }, __classPrivateFieldGet(this, _GxIdeSelectUserTeam_displayTeamsTransitionTime, "f") * 2);
    }
    async componentWillLoad() {
        __classPrivateFieldSet(this, _GxIdeSelectUserTeam_componentLocale, await Locale.getComponentStrings(this.el), "f");
        this.teamsChanged(this.teams);
        this.el.style.setProperty("--display-teams-transtion-time", __classPrivateFieldGet(this, _GxIdeSelectUserTeam_displayTeamsTransitionTime, "f").toString() + "ms");
    }
    componentDidLoad() {
        this.slideIsVisible = true;
    }
    render() {
        var _a;
        return (h(Host, null, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "slide" }, h("img", { src: COPYRIGHTS_ILLUSTRATION, class: "slide__illustration", alt: "" // decorative
        }), h("div", { class: {
                "slide__main": true,
                "slide__main--visible": this.slideIsVisible
            } }, h("div", { class: "slide__main-container" }, this.teamsModelReady ? ([
            h("header", { class: "slide__main-header" }, h("img", { src: ICON_NEXT, alt: "" // decorative
            }), h("h2", {
                // Split the title into two spans for better styling
                class: "slide__main-title"
            }, h("span", null, __classPrivateFieldGet(this, _GxIdeSelectUserTeam_componentLocale, "f").title))),
            h("div", { class: "slide__select-team-description" }, h("p", { class: "body-semi-bold-l" }, __classPrivateFieldGet(this, _GxIdeSelectUserTeam_componentLocale, "f").infoMessage)),
            h("div", { class: "field-group" }, h("div", { class: "field field-block" }, h("label", { htmlFor: "teams" }, __classPrivateFieldGet(this, _GxIdeSelectUserTeam_componentLocale, "f").teams), h("ch-combo-box-render", { id: "teams", accessibleName: "Teams", class: "combo-box teams-list", model: __classPrivateFieldGet(this, _GxIdeSelectUserTeam_userTeamsModel, "f"), value: __classPrivateFieldGet(this, _GxIdeSelectUserTeam_userTeamsModel, "f") && ((_a = __classPrivateFieldGet(this, _GxIdeSelectUserTeam_userTeamsModel, "f")[0]) === null || _a === void 0 ? void 0 : _a.value), ref: (el) => (__classPrivateFieldSet(this, _GxIdeSelectUserTeam_chSelectTeamEl, el, "f")) }))),
            h("div", { class: "buttons-container" }, h("button", { class: "button-primary continue-btn", onClick: __classPrivateFieldGet(this, _GxIdeSelectUserTeam_continueHandler, "f") }, __classPrivateFieldGet(this, _GxIdeSelectUserTeam_componentLocale, "f").continueButtonCaption), h("button", { class: "button-secondary cancel-btn", onClick: __classPrivateFieldGet(this, _GxIdeSelectUserTeam_cancelHandler, "f") }, __classPrivateFieldGet(this, _GxIdeSelectUserTeam_componentLocale, "f").cancelButtonCaption))
        ]) : (h("gx-ide-loader", { show: true, loaderTitle: __classPrivateFieldGet(this, _GxIdeSelectUserTeam_componentLocale, "f").loader.title, description: __classPrivateFieldGet(this, _GxIdeSelectUserTeam_componentLocale, "f").loader.description })))))));
    }
    static get is() { return "gx-ide-select-user-team"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["select-user-team.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["select-user-team.css"]
        };
    }
    static get assetsDirs() { return ["gx-ide-assets/select-user-team"]; }
    static get properties() {
        return {
            "cancelCallback": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "() => Promise<void>",
                    "resolved": "() => Promise<void>",
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    }
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Callback executed when the user clicks the 'Cancel' button"
                }
            },
            "continueCallback": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "(teamId: string) => Promise<void>",
                    "resolved": "(teamId: string) => Promise<void>",
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    }
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Callback executed when the user clicks the 'Continue' button"
                }
            },
            "teams": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "TeamData[]",
                    "resolved": "TeamData[]",
                    "references": {
                        "TeamData": {
                            "location": "local",
                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/select-user-team/select-user-team.tsx",
                            "id": "src/components/select-user-team/select-user-team.tsx::TeamData"
                        }
                    }
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Array that contains the user's teams"
                }
            }
        };
    }
    static get states() {
        return {
            "slideIsVisible": {},
            "teamsModelReady": {}
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "teams",
                "methodName": "teamsChanged"
            }];
    }
}
_GxIdeSelectUserTeam_componentLocale = new WeakMap(), _GxIdeSelectUserTeam_userTeamsModel = new WeakMap(), _GxIdeSelectUserTeam_chSelectTeamEl = new WeakMap(), _GxIdeSelectUserTeam_displayTeamsTransitionTime = new WeakMap(), _GxIdeSelectUserTeam_continueHandler = new WeakMap(), _GxIdeSelectUserTeam_cancelHandler = new WeakMap();
//# sourceMappingURL=select-user-team.js.map
