import { h } from "@stencil/core";
import { ProgressListVariation } from "./progress-list-variation.enum";
import { ProgressListHeadingLevel } from "./progress-list-heading-level.enum";
import { ProgressListType } from "./progress-list-type.enum";
import { ProgressListStatus } from "./progress-list-status.enum";
import { logger } from "../../../global/utils/logger";
/**
 * @enums ProgressListHeadingLevel - progress-list-heading-level.enum
 * @enums ProgressListVariation - progress-list-variation.enum
 * @enums ProgressListStatus - progress-list-status.enum
 * @enums ProgressListType - progress-list-type.enum
 * @swedishName Förloppslista
 */
export class ProgressList {
    constructor() {
        this.afHeading = undefined;
        this.afAriaLabel = undefined;
        this.afHeadingLevel = ProgressListHeadingLevel.H2;
        this.afVariation = ProgressListVariation.PRIMARY;
        this.afType = ProgressListType.CIRCLE;
        this.afExpandable = false;
        this.afExpandText = '';
        this.afCollapseText = '';
        this.afCurrentStep = 1;
        this.steps = [];
    }
    async afMNext() {
        this.afCurrentStep += 1;
    }
    async afMPrevious() {
        this.afCurrentStep -= 1;
    }
    componentWillLoad() {
        this.getSteps();
        this.setStepAndTypeProps();
    }
    componentWillUpdate() {
        this.getSteps();
        this.setStepAndTypeProps();
    }
    componentDidLoad() {
        this.afOnReady.emit();
    }
    getSteps() {
        const steps = this.hostElement.querySelectorAll('digi-progress-list-item');
        if (!steps || steps.length <= 0) {
            logger.warn(`The slot contains no children elements.`, this.hostElement);
            return;
        }
        this.steps = [...Array.from(steps)].map((step) => {
            return {
                outerHTML: step.outerHTML,
                ref: step
            };
        });
    }
    setStepAndTypeProps() {
        if (this.steps && this.afCurrentStep < 1) {
            logger.warn(`Current step is set to ${this.afCurrentStep} which is not allowed.`, this.hostElement);
            this.afCurrentStep = 1;
            return;
        }
        if (this.steps && this.afCurrentStep > this.steps.length + 1) {
            logger.warn(`Current step is set to ${this.afCurrentStep} which is more than the amount of available steps (${this.steps.length}).`, this.hostElement);
            this.afCurrentStep = this.steps.length + 1;
            return;
        }
        this.steps &&
            this.steps.forEach((step, index) => {
                step.ref.afVariation = this.afVariation;
                try {
                    const topLevelN = Number.parseInt(this.afHeadingLevel.split('h')[1]) + 1;
                    const topLevel = Math.max(Math.min(topLevelN, 6), 1);
                    const afHeadingLevel = 'h' + topLevel;
                    const isLast = index == this.steps.length - 1;
                    step.ref.afIsLast = isLast;
                    let status;
                    if (index < this.afCurrentStep - 1) {
                        status = ProgressListStatus.DONE;
                    }
                    else if (index == this.afCurrentStep - 1) {
                        status = ProgressListStatus.CURRENT;
                    }
                    else {
                        status = ProgressListStatus.UPCOMING;
                    }
                    step.ref.afStepStatus = status;
                    step.ref.afType = this.afType;
                    step.ref.afHeadingLevel = afHeadingLevel;
                    // If expandable, check if expanded
                    step.ref.afExpandable = this.afExpandable;
                    step.ref.afExpanded = status === ProgressListStatus.CURRENT;
                    step.ref.afExpandText = this.afExpandText;
                    step.ref.afCollapseText = this.afCollapseText;
                }
                catch (e) {
                    logger.warn(`Error in setStepAndTypeProps, `, e);
                }
            });
    }
    renderHeading() {
        var _a;
        if (((_a = this.afHeading) === null || _a === void 0 ? void 0 : _a.trim().length) > 1) {
            return (h("div", null, h(this.afHeadingLevel, { class: "digi-progress-list__header", "aria-label": this.afAriaLabel }, this.afHeading)));
        }
        return null;
    }
    render() {
        return (h("div", { key: '49e79226a302b6f1600eb8a8071fc52ed9d1af17', class: "digi-progress-list" }, h("digi-typography", { key: '5393e83a0748300d42a1e4044af64c592805cc6b' }, this.renderHeading(), h("ol", { key: '80d221f36d6e8539c81a8a55ef31457d88a55f09', class: "digi-progress-list__content" }, h("slot", { key: 'a67b614383b6fbc3e1dace65a8641860d163e51a' })))));
    }
    static get is() { return "digi-progress-list"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "$": ["progress-list.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["progress-list.css"]
        };
    }
    static get properties() {
        return {
            "afHeading": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "The heading of text"
                        }],
                    "text": "Rubrikens text"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-heading",
                "reflect": false
            },
            "afAriaLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set aria-label attribute"
                        }],
                    "text": "S\u00E4tter attributet 'aria-label'"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-aria-label",
                "reflect": false
            },
            "afHeadingLevel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "ProgressListHeadingLevel",
                    "resolved": "ProgressListHeadingLevel.H1 | ProgressListHeadingLevel.H2 | ProgressListHeadingLevel.H3 | ProgressListHeadingLevel.H4 | ProgressListHeadingLevel.H5 | ProgressListHeadingLevel.H6",
                    "references": {
                        "ProgressListHeadingLevel": {
                            "location": "import",
                            "path": "./progress-list-heading-level.enum",
                            "id": "src/components/_progress/progress-list/progress-list-heading-level.enum.ts::ProgressListHeadingLevel"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set heading level. Default is 'h2'"
                        }],
                    "text": "S\u00E4tter rubrikniv\u00E5 p\u00E5 varje f\u00F6rloppsteg. 'h2' \u00E4r f\u00F6rvalt."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-heading-level",
                "reflect": false,
                "defaultValue": "ProgressListHeadingLevel.H2"
            },
            "afVariation": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "ProgressListVariation",
                    "resolved": "ProgressListVariation.PRIMARY | ProgressListVariation.SECONDARY | ProgressListVariation.TERTIARY",
                    "references": {
                        "ProgressListVariation": {
                            "location": "import",
                            "path": "./progress-list-variation.enum",
                            "id": "src/components/_progress/progress-list/progress-list-variation.enum.ts::ProgressListVariation"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set variation. Can be 'Primary', 'Secondary' or 'Tertiary'"
                        }],
                    "text": "S\u00E4tter variant. Kan vara 'Primary', 'Secondary' eller 'Tertiary'"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-variation",
                "reflect": false,
                "defaultValue": "ProgressListVariation.PRIMARY"
            },
            "afType": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "ProgressListType",
                    "resolved": "ProgressListType.CIRCLE | ProgressListType.ICON",
                    "references": {
                        "ProgressListType": {
                            "location": "import",
                            "path": "./progress-list-type.enum",
                            "id": "src/components/_progress/progress-list/progress-list-type.enum.ts::ProgressListType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set type. Can be 'Circle' or 'Icon'"
                        }],
                    "text": "S\u00E4tter typ. Kan vara 'Circle' eller 'Icon'"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-type",
                "reflect": false,
                "defaultValue": "ProgressListType.CIRCLE"
            },
            "afExpandable": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Sets the state of the Header item to expanded or not. Default is false."
                        }],
                    "text": "S\u00E4tter l\u00E4ge p\u00E5 Rubriken om den ska vara expanderad eller ej. F\u00F6rvalt \u00E4r false."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-expandable",
                "reflect": false,
                "defaultValue": "false"
            },
            "afExpandText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Sets the text displayed on the button that expands the component, eg. 'Show more'.\nDefault is icon only and this field is empty."
                        }],
                    "text": "S\u00E4tter texten som visas p\u00E5 knappen som expanderar komponenten, t.ex: 'Visa mer'.\nF\u00F6rvalt \u00E4r endast ikon och detta f\u00E4lt \u00E4r tomt."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-expand-text",
                "reflect": false,
                "defaultValue": "''"
            },
            "afCollapseText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Sets the text displayed on the button that expands the component, eg: 'Show less'.\nDefault is icon only and this field is empty."
                        }],
                    "text": "S\u00E4tter texten som visas p\u00E5 knappen som minimerar komponenten, t.ex: 'Visa mindre'.\nF\u00F6rvalt \u00E4r endast ikon och detta f\u00E4lt \u00E4r tomt."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-collapse-text",
                "reflect": false,
                "defaultValue": "''"
            },
            "afCurrentStep": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set current steps"
                        }],
                    "text": "S\u00E4tter nuvarande steg"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-current-step",
                "reflect": false,
                "defaultValue": "1"
            }
        };
    }
    static get states() {
        return {
            "steps": {}
        };
    }
    static get events() {
        return [{
                "method": "afOnReady",
                "name": "afOnReady",
                "bubbles": false,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "When the component and slots are loaded and initialized this event will trigger."
                        }],
                    "text": "N\u00E4r komponenten och slotsen \u00E4r laddade och initierade s\u00E5 skickas detta eventet."
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }];
    }
    static get methods() {
        return {
            "afMNext": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "",
                    "tags": []
                }
            },
            "afMPrevious": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "",
                    "tags": []
                }
            }
        };
    }
    static get elementRef() { return "hostElement"; }
}
