import { h } from "@stencil/core";
import { FormReceiptHeadingLevel } from "./form-receipt-heading-level.enum";
import { FormReceiptVariation } from "./form-receipt-variation.enum";
import { FormReceiptType } from "./form-receipt-type.enum";
import { LayoutBlockVariation } from "../../../enums";
/**
 * @enums FormReceiptVariation - receipt-variation.enum.ts
 * @enums FormReceiptType - receipt-type.enum.ts
 * @enums FormReceiptHeadingLevel - receipt-heading-level.enum.ts
 * @swedishName Kvittens
 */
export class FormReceipt {
    constructor() {
        this.afText = '';
        this.afVariation = FormReceiptVariation.FULLWIDTH;
        this.afType = FormReceiptType.CENTER;
        this.afHeadingLevel = FormReceiptHeadingLevel.H2;
        this.hasDefaultSlot = false;
    }
    componentDidLoad() {
        this.checkSlotContent();
    }
    checkSlotContent() {
        var _a;
        const slotWrapper = (_a = this.hostElement) === null || _a === void 0 ? void 0 : _a.querySelector('.digi-form-receipt__slot-wrapper');
        if (!slotWrapper)
            return;
        this.hasDefaultSlot = slotWrapper.innerHTML.trim() !== '';
        if (this.afType === FormReceiptType.CENTER) {
            const typographyElements = slotWrapper.querySelectorAll(':scope > .hydrated');
            const buttonElements = slotWrapper.querySelectorAll(':scope > .sc-digi-button-h');
            buttonElements.forEach((element) => {
                element.classList.add('digi-form-receipt__slot-wrapper-center-text');
            });
            typographyElements.forEach((element) => {
                const typography = element.querySelector(':scope > .digi-typography');
                if (typography) {
                    typography.classList.add('digi-form-receipt__slot-wrapper-center-text');
                }
            });
        }
    }
    get cssModifiers() {
        return {
            'digi-form-receipt--fullwidth': this.afVariation === FormReceiptVariation.FULLWIDTH,
            'digi-form-receipt--grid': this.afVariation === FormReceiptVariation.GRID,
            'digi-form-receipt--center': this.afType === FormReceiptType.CENTER,
            'digi-form-receipt--start': this.afType === FormReceiptType.START
        };
    }
    get slotContent() {
        return (h("div", { class: {
                'digi-form-receipt__slot-wrapper': true,
                'digi-form-receipt__slot-wrapper-has-content': this.hasDefaultSlot
            } }, h("slot", null)));
    }
    get content() {
        return (h("div", { class: "digi-form-receipt__content" }, h("svg", { class: "digi-form-receipt__icon", "aria-hidden": "true", version: "1.1", viewBox: "0 0 35 29" }, h("title", null, "Check mark"), h("g", { fill: "none", "fill-rule": "evenodd" }, h("g", { transform: "translate(-170 -32)" }, h("g", { transform: "translate(170 32.325)" }, h("g", { transform: "translate(0 .77495)" }, h("mask", { id: "b", fill: "white" }, h("polygon", { points: "0 0 26.685 0 26.685 27.689 0 27.689" })), h("path", { d: "m13.711 27.689c-7.5602 0-13.711-6.2103-13.711-13.844 0-7.6345 6.151-13.845 13.711-13.845 3.1693 0 6.2611 1.1179 8.7048 3.1478l-1.5894 1.9509c-1.9972-1.6592-4.5241-2.5724-7.1155-2.5724-6.181 0-11.209 5.0773-11.209 11.319 0 6.2406 5.0283 11.318 11.209 11.318 4.7924 0 9.0551-3.0733 10.607-7.6478l2.3668 0.81853c-1.8983 5.5958-7.1124 9.3556-12.974 9.3556", fill: "#333", mask: "url(#b)" })), h("g", { transform: "translate(4.2177)" }, h("mask", { id: "a", fill: "white" }, h("polygon", { points: "0 0 30.425 0 30.425 23.496 0 23.496" })), h("path", { class: "digi-form-receipt__infographic-primary", d: "m30.191 3.2545-19.95 20.007c-0.31227 0.31253-0.81758 0.31253-1.1292 0l-8.878-8.9033c-0.31164-0.31316-0.31164-0.81992 0-1.1324l1.8818-1.8878c0.31164-0.31253 0.81758-0.31253 1.1292 0l6.4315 6.4499 17.504-17.553c0.31164-0.31316 0.81695-0.31316 1.1292 0l1.8818 1.8872c0.31164 0.31253 0.31164 0.81929 0 1.1324", fill: "#95C13E", mask: "url(#a)" })))))), h(this.afHeadingLevel, { class: "digi-form-receipt__heading", tabIndex: -1 }, this.afText), this.slotContent));
    }
    render() {
        return (h("div", { key: 'd202410625db1ed892a364374b1516df522df2f6', class: Object.assign({ 'digi-form-receipt': true }, this.cssModifiers) }, this.afVariation === FormReceiptVariation.FULLWIDTH ? (h("digi-layout-block", { afVariation: LayoutBlockVariation.TRANSPARENT }, this.content)) : (this.content)));
    }
    static get is() { return "digi-form-receipt"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "$": ["form-receipt.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["form-receipt.css"]
        };
    }
    static get properties() {
        return {
            "afText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set text to be shown"
                        }],
                    "text": "S\u00E4tter texten som ska visas"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-text",
                "reflect": false,
                "defaultValue": "''"
            },
            "afVariation": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "FormReceiptVariation",
                    "resolved": "FormReceiptVariation.FULLWIDTH | FormReceiptVariation.GRID",
                    "references": {
                        "FormReceiptVariation": {
                            "location": "import",
                            "path": "./form-receipt-variation.enum",
                            "id": "src/components/_form/form-receipt/form-receipt-variation.enum.ts::FormReceiptVariation"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set card variation. Can be 'fullwidth' or 'grid'."
                        }],
                    "text": "S\u00E4tter variationen p\u00E5 kortet. Kan vara 'fullwidth' eller 'grid'."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-variation",
                "reflect": false,
                "defaultValue": "FormReceiptVariation.FULLWIDTH"
            },
            "afType": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "FormReceiptType",
                    "resolved": "FormReceiptType.CENTER | FormReceiptType.START",
                    "references": {
                        "FormReceiptType": {
                            "location": "import",
                            "path": "./form-receipt-type.enum",
                            "id": "src/components/_form/form-receipt/form-receipt-type.enum.ts::FormReceiptType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set font alignment. Can be 'center' or 'start'."
                        }],
                    "text": "S\u00E4tter textsnittsjusteringen. Kan vara 'center' eller 'start'."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-type",
                "reflect": false,
                "defaultValue": "FormReceiptType.CENTER"
            },
            "afHeadingLevel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "FormReceiptHeadingLevel",
                    "resolved": "FormReceiptHeadingLevel.H1 | FormReceiptHeadingLevel.H2 | FormReceiptHeadingLevel.H3 | FormReceiptHeadingLevel.H4 | FormReceiptHeadingLevel.H5 | FormReceiptHeadingLevel.H6",
                    "references": {
                        "FormReceiptHeadingLevel": {
                            "location": "import",
                            "path": "./form-receipt-heading-level.enum",
                            "id": "src/components/_form/form-receipt/form-receipt-heading-level.enum.ts::FormReceiptHeadingLevel"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set text level (h1-h6)"
                        }],
                    "text": "S\u00E4tter textens vikt (h1-h6)"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-heading-level",
                "reflect": false,
                "defaultValue": "FormReceiptHeadingLevel.H2"
            }
        };
    }
    static get states() {
        return {
            "hasDefaultSlot": {}
        };
    }
    static get elementRef() { return "hostElement"; }
}
