'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-7a477838.js');
const randomIdGenerator_util = require('./randomIdGenerator.util-e7f4b6de.js');
const typographyVariation_enum = require('./typography-variation.enum-8fd8bed4.js');
const layoutBlockVariation_enum = require('./layout-block-variation.enum-f6102119.js');
require('./badge-notification-shape.enum-ff802554.js');
require('./badge-status-variation.enum-0a5adc21.js');
const codeExampleVariation_enum = require('./code-example-variation.enum-1611825e.js');
require('./form-input-search-variation.enum-e0e025b1.js');
const buttonVariation_enum = require('./button-variation.enum-bc521499.js');
require('./calendar-week-view-heading-level.enum-fd0c841b.js');
require('./code-variation.enum-c4a4e6fd.js');
require('./expandable-accordion-header-level.enum-45483252.js');
require('./expandable-faq-item-variation.enum-89427195.js');
require('./expandable-faq-variation.enum-af923f49.js');
require('./footer-card-variation.enum-99555edc.js');
require('./form-checkbox-variation.enum-d2ca879e.js');
require('./form-file-upload-variation.enum-634cfae8.js');
require('./form-input-type.enum-9c8ee12a.js');
require('./form-input-variation.enum-c750520c.js');
require('./form-select-variation.enum-528c1bf0.js');
require('./form-textarea-variation.enum-9c90d40f.js');
require('./form-validation-message-variation.enum-855ae0be.js');
require('./info-card-multi-type.enum-14746572.js');
require('./info-card-variation.enum-64cef637.js');
require('./layout-columns-variation.enum-65675649.js');
require('./link-button-variation.enum-137785e3.js');
require('./list-type.enum-aea4d012.js');
require('./loader-skeleton-variation.enum-d52ba55e.js');
require('./loader-spinner-size.enum-db2973f0.js');
require('./logo-variation.enum-607fadb4.js');
require('./media-figure-alignment.enum-3885aba5.js');
require('./navigation-sidebar-variation.enum-1c0c3064.js');
require('./progress-indicator-variation.enum-7cf8e0e4.js');
require('./progress-list-item-variation.enum-90e4c874.js');
require('./progress-list-variation.enum-06d5ce27.js');
require('./progressbar-variation.enum-aff9fa80.js');
require('./quote-image-inner-position.enum-e64e7a6d.js');
require('./table-variation.enum-25df2ad7.js');
require('./tag-media-icon.enum-372563c5.js');
require('./tag-size.enum-387c516c.js');
require('./tools-feedback-banner-type.enum-de373ba0.js');
require('./tools-feedback-rating-variation.enum-2f71e84d.js');
require('./tools-theme-provider.brand.enum-bc855272.js');
require('./typography-heading-jumbo-variation.enum-8677e099.js');
require('./typography-meta-variation.enum-13ac3538.js');
require('./typography-time-variation.enum-bce1d87e.js');
require('./util-breakpoint-observer-breakpoints.enum-e96d3a84.js');

const toolsFeedbackCss = ".sc-digi-tools-feedback-h{--digi--tools-feedback--background-color--primary:var(--digi--color--background--pop-out);--digi--tools-feedback--background-color--secondary:var(--digi--color--background--primary);--digi--tools-feedback--padding:var(--digi--padding--large);--digi--tools-feedback--font-size--desktop:var(--digi--typography--heading-2--font-size--desktop);--digi--tools-feedback--font-size--mobile:var(--digi--typography--heading-2--font-size--mobile);--digi--tools-feedback--heading--font-family:var(--digi--global--typography--font-family--default);--digi--tools-feedback--heading--font-weight:var(--digi--typography--heading-4--font-weight--desktop)}.sc-digi-tools-feedback-h .digi-tools-feedback.sc-digi-tools-feedback{background-color:var(--BACKGROUND-COLOR);font-family:var(--digi--tools-feedback--heading--font-family)}@media (max-width: 47.9375rem){.sc-digi-tools-feedback-h .digi-tools-feedback.sc-digi-tools-feedback{padding-top:var(--digi--padding--medium);padding-inline-start:0;padding-bottom:3rem}}.sc-digi-tools-feedback-h .digi-tools-feedback--primary.sc-digi-tools-feedback{--BACKGROUND-COLOR:var(--digi--tools-feedback--background-color--primary)}.sc-digi-tools-feedback-h .digi-tools-feedback--secondary.sc-digi-tools-feedback{--BACKGROUND-COLOR:var(--digi--tools-feedback--background-color--secondary)}.sc-digi-tools-feedback-h .digi-tools-feedback--grid.sc-digi-tools-feedback{display:grid;padding-inline:var(--digi--padding--medium)}.sc-digi-tools-feedback-h .digi-tools-feedback--grid.sc-digi-tools-feedback .digi-tools-feedback__container.sc-digi-tools-feedback{grid-column:1;grid-row:1}.sc-digi-tools-feedback-h .digi-tools-feedback__container.sc-digi-tools-feedback{display:flex;flex-direction:row;align-items:center;padding-top:var(--digi--padding--largest-3);padding-bottom:3.563rem}@media (max-width: 47.9375rem){.sc-digi-tools-feedback-h .digi-tools-feedback__container.sc-digi-tools-feedback{display:flex;flex-direction:column;align-items:flex-start;padding-inline-start:0;padding-top:0;padding-bottom:0}}.sc-digi-tools-feedback-h .digi-tools-feedback__container-header.sc-digi-tools-feedback{display:flex;flex-direction:row;padding-inline-end:var(--digi--padding--largest-3);font-size:var(--digi--tools-feedback--font-size--desktop)}@media (max-width: 47.9375rem){.sc-digi-tools-feedback-h .digi-tools-feedback__container-header.sc-digi-tools-feedback{padding-inline-start:0;padding-inline-end:0}}.sc-digi-tools-feedback-h .digi-tools-feedback__container-header-title.sc-digi-tools-feedback{margin-top:0.4rem;font-size:var(--digi--tools-feedback--font-size--desktop);margin-bottom:0 !important;font-weight:var(--digi--tools-feedback--heading--font-weight)}@media (max-width: 47.9375rem){.sc-digi-tools-feedback-h .digi-tools-feedback__container-header-title.sc-digi-tools-feedback{font-size:var(--digi--tools-feedback--font-size--mobile)}}.sc-digi-tools-feedback-h .digi-tools-feedback__container-header-icon.sc-digi-tools-feedback{margin-top:0.4rem;padding-inline-end:var(--digi--padding--large);flex-shrink:0}@media (max-width: 47.9375rem){.sc-digi-tools-feedback-h .digi-tools-feedback__container-header-icon.sc-digi-tools-feedback{padding-inline-end:var(--digi--padding--medium)}}.sc-digi-tools-feedback-h .digi-tools-feedback__container-btns.sc-digi-tools-feedback{display:flex;column-gap:var(--digi--padding--smaller)}.sc-digi-tools-feedback-h .digi-tools-feedback__container-btns.sc-digi-tools-feedback digi-button.sc-digi-tools-feedback{--digi--button--width:5.625rem;text-align:center}@media (max-width: 47.9375rem){.sc-digi-tools-feedback-h .digi-tools-feedback__container-btns.sc-digi-tools-feedback{padding-top:var(--digi--padding--medium);padding-inline-start:calc(58px + 1rem)}}.sc-digi-tools-feedback-h .digi-tools-feedback__infographic-secondary.sc-digi-tools-feedback{fill:var(--digi--color--infographic--brand--secondary)}.sc-digi-tools-feedback-h .digi-tools-feedback__infographic-primary.sc-digi-tools-feedback{fill:var(--digi--color--infographic--brand--primary)}.sc-digi-tools-feedback-h .digi-tools-feedback__close-button.sc-digi-tools-feedback{visibility:hidden}.sc-digi-tools-feedback-h .digi-tools-feedback--step-two.sc-digi-tools-feedback .digi-tools-feedback__container.sc-digi-tools-feedback{padding-bottom:0}.sc-digi-tools-feedback-h .digi-tools-feedback--step-three.sc-digi-tools-feedback{padding-inline-start:var(--digi--padding--medium);padding-top:var(--digi--padding--largest-3);padding-bottom:3.563rem}@media (max-width: 47.9375rem){.sc-digi-tools-feedback-h .digi-tools-feedback--step-three.sc-digi-tools-feedback{padding-inline-start:0}}.sc-digi-tools-feedback-h .digi-tools-feedback--step-three.sc-digi-tools-feedback .digi-tools-feedback__container-header-icon.sc-digi-tools-feedback{margin-top:0.65rem}.sc-digi-tools-feedback-s>[slot=form]{display:none}.digi-tools-feedback--step-two.sc-digi-tools-feedback .digi-tools-feedback__close-button.sc-digi-tools-feedback{display:grid;justify-content:end;padding-top:var(--digi--padding--medium);padding-inline-end:var(--digi--padding--smaller);visibility:visible}@media (max-width: 47.9375rem){.digi-tools-feedback--step-two.sc-digi-tools-feedback .digi-tools-feedback__close-button.sc-digi-tools-feedback{padding-top:0;padding-bottom:var(--digi--padding--medium)}}.digi-tools-feedback--step-two.sc-digi-tools-feedback-s>[slot=form],.digi-tools-feedback--step-two .sc-digi-tools-feedback-s>[slot=form]{display:flex;flex-direction:column;padding-top:var(--digi--padding--large);padding-bottom:3.563rem;max-width:37.5rem}@media (max-width: 47.9375rem){.digi-tools-feedback--step-two.sc-digi-tools-feedback-s>[slot=form],.digi-tools-feedback--step-two .sc-digi-tools-feedback-s>[slot=form]{padding-inline-start:0}}";
const DigiToolsFeedbackStyle0 = toolsFeedbackCss;

const ToolsFeedback = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.afOnReady = index.createEvent(this, "afOnReady", 3);
        this.afVariation = typographyVariation_enum.FeedbackVariation.PRIMARY;
        this.afType = typographyVariation_enum.ToolsFeedbackType.FULLWIDTH;
        this.afText = undefined;
        this.afCloseButtonText = 'Stäng';
        this.afHeadingLevel = typographyVariation_enum.ToolsFeedbackHeadingLevel.H4;
        this.afFeedback = undefined;
        this.afId = randomIdGenerator_util.randomIdGenerator('digi-tools-feedback');
        this.afIsDone = false;
        this.currentStep = 1;
    }
    afIsDoneHandler() {
        this.currentStep = 3;
    }
    /**
     * Används för att nollställa.
     * @en Use to reset interaction.
     */
    async afMReset() {
        this.currentStep = 1;
    }
    /**
     * Används för att ändra steg mellan 1-3.
     * @en Use to change step between 1-3
     * @ignore
     */
    async afMSetStep(step) {
        this.currentStep = step;
    }
    get cssModifiers() {
        return {
            'digi-tools-feedback--primary': this.afVariation === typographyVariation_enum.FeedbackVariation.PRIMARY,
            'digi-tools-feedback--secondary': this.afVariation === typographyVariation_enum.FeedbackVariation.SECONDARY,
            'digi-tools-feedback--step-one': this.currentStep === 1,
            'digi-tools-feedback--step-two': this.currentStep === 2,
            'digi-tools-feedback--step-three': this.currentStep === 3,
            'digi-tools-feedback--fullwidth': this.afType === typographyVariation_enum.ToolsFeedbackType.FULLWIDTH,
            'digi-tools-feedback--grid': this.afType === typographyVariation_enum.ToolsFeedbackType.GRID
        };
    }
    get icon() {
        return (index.h("svg", { class: "digi-tools-feedback__container-header-icon", "aria-hidden": "true", viewBox: "0 0 60 48", version: "1.1", width: "58", height: "48" }, index.h("title", null, "Chat"), index.h("g", { id: "Mainpage", stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd" }, index.h("g", { id: "\u00D6versikt-moduler-feedback-design-v1", transform: "translate(-1121.000000, -1074.000000)" }, index.h("g", { id: "Group-27-Copy-2", transform: "translate(1122.000000, 1075.000000)" }, index.h("path", { d: "M31.3351987,35.0796454 C31.3351987,37.3388621 33.1498711,39.1874113 35.3679732,39.1874113 L43.2325677,39.1874113 L49.7962813,44.9840831 L49.7962813,39.1874113 L52.6602616,39.1874113 C54.8781464,39.1874113 56.6928188,37.3388621 56.6928188,35.0796454 L56.6928188,17.9415266 C56.6928188,15.6820918 54.8781464,13.8335426 52.6602616,13.8335426 L37.4687612,13.8335426 C37.4687612,13.8335426 37.5319804,25.5217561 37.5319804,27.0499279 C37.5319804,28.5778817 36.1843911,32.189488 31.3351987,32.189488 C31.3043495,34.4120652 31.3351987,35.0796454 31.3351987,35.0796454", id: "Fill-1", class: "digi-tools-feedback__infographic-secondary" }), index.h("path", { d: "M38.1172465,13.8645553 L53.9081341,13.8645553 C56.158606,13.8645553 58,15.7131045 58,17.9723213 L58,36.0955623 C58,38.3547791 56.158606,40.2033283 53.9081341,40.2033283 L51.0022249,40.2033283 L51.0022249,46 L44.341836,40.2033283 L36.3618827,40.2033283 C34.1111935,40.2033283 32.2697995,38.3547791 32.2697995,36.0955623 L32.2697995,32.521904", id: "Stroke-3", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("g", { id: "Group-8" }, index.h("path", { d: "M38.1172465,13.8645553 L38.1172465,5.18012517 C38.1172465,2.35604969 35.815504,0.0453631709 33.0023598,0.0453631709 L33.0251708,0 L5.11488673,0 C2.30174248,0 0,2.31068652 0,5.134762 L0,27.387142 C0,30.2112175 2.30174248,32.521904 5.11488673,32.521904 L9.88217668,32.521904 L9.88217668,43.3905272 L20.0617659,32.521904 L33.0023598,32.521904 C35.815504,32.521904 38.1172465,30.2112175 38.1172465,27.387142 L38.1172465,13.8143941", id: "Fill-5", fill: "#FFFFFF" }), index.h("path", { d: "M38.1172465,13.8645553 L38.1172465,5.18012517 C38.1172465,2.35604969 35.815504,0.0453631709 33.0023598,0.0453631709 L33.0251708,0 L5.11488673,0 C2.30174248,0 0,2.31068652 0,5.134762 L0,27.387142 C0,30.2112175 2.30174248,32.521904 5.11488673,32.521904 L9.88217668,32.521904 L9.88217668,43.3905272 L20.0617659,32.521904 L33.0023598,32.521904 C35.815504,32.521904 38.1172465,30.2112175 38.1172465,27.387142 L38.1172465,13.8143941", id: "Stroke-7", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" })), index.h("line", { x1: "28.4671558", y1: "9.19912763", x2: "9.71648163", y2: "9.19912763", id: "Stroke-9", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "51.0653789", y1: "23.3170842", x2: "47.8731369", y2: "23.3170842", id: "Stroke-11", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "46.5029755", y1: "23.3170842", x2: "43.3107335", y2: "23.3170842", id: "Stroke-13", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "41.9405939", y1: "23.3170842", x2: "38.7483519", y2: "23.3170842", id: "Stroke-15", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "51.0653789", y1: "27.7662735", x2: "46.4946984", y2: "27.7662735", id: "Stroke-17", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "43.2358916", y1: "27.7662735", x2: "38.4564358", y2: "27.7662735", id: "Stroke-19", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "28.4671558", y1: "13.9050986", x2: "9.71648163", y2: "13.9050986", id: "Stroke-21", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "28.4671558", y1: "18.6110914", x2: "9.71648163", y2: "18.6110914", id: "Stroke-23", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }), index.h("line", { x1: "21.4671558", y1: "23.3170842", x2: "9.72", y2: "23.3170842", id: "Stroke-25", stroke: "#333333", "stroke-width": "1.296", "stroke-linejoin": "round" }))))));
    }
    get responseIcon() {
        return (index.h("svg", { class: "digi-tools-feedback__container-header-icon", "aria-hidden": "true", version: "1.1", viewBox: "0 0 35 29", width: "31", height: "25" }, index.h("title", null, "Check mark"), index.h("g", { fill: "none", "fill-rule": "evenodd" }, index.h("g", { transform: "translate(-170 -32)" }, index.h("g", { transform: "translate(170 32.325)" }, index.h("g", { transform: "translate(0 .77495)" }, index.h("mask", { id: "b", fill: "white" }, index.h("polygon", { points: "0 0 26.685 0 26.685 27.689 0 27.689" })), index.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)" })), index.h("g", { transform: "translate(4.2177)" }, index.h("mask", { id: "a", fill: "white" }, index.h("polygon", { points: "0 0 30.425 0 30.425 23.496 0 23.496" })), index.h("path", { 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", class: "digi-tools-feedback__infographic-primary", mask: "url(#a)" })))))));
    }
    get content() {
        return (index.h("div", null, this.currentStep === 1 && (index.h("div", { class: "digi-tools-feedback__container" }, index.h("div", { class: "digi-tools-feedback__container-header" }, this.icon, index.h(this.afHeadingLevel, { class: "digi-tools-feedback__container-header-title" }, this.afText)), index.h("div", { class: "digi-tools-feedback__container-btns" }, index.h("digi-button", { "af-size": codeExampleVariation_enum.ButtonSize.MEDIUM, "af-variation": buttonVariation_enum.ButtonVariation.SECONDARY, "af-full-width": "false", onAfOnClick: () => {
                this.currentStep = 3;
            } }, "Ja"), index.h("digi-button", { "af-size": codeExampleVariation_enum.ButtonSize.MEDIUM, "af-variation": buttonVariation_enum.ButtonVariation.SECONDARY, "af-full-width": "false", onAfOnClick: () => {
                this.currentStep = 2;
            } }, "Nej")))), this.currentStep === 2 && (index.h("div", { class: "digi-tools-feedback__container" }, index.h("div", { class: "digi-tools-feedback__container-header" }, ' ', this.icon, index.h("div", { class: "digi-tools-feedback__container-header-title" }, "Hur kan vi bli b\u00E4ttre?")))), index.h("div", { class: "digi-tools-feedback__container-forms" }, index.h("slot", { name: "form" })), this.currentStep === 3 && (index.h("div", { class: "digi-tools-feedback__container-header" }, this.responseIcon, index.h("div", { class: "digi-tools-feedback__container-header-title" }, "Tack f\u00F6r din \u00E5terkoppling!")))));
    }
    componentDidLoad() {
        this.afOnReady.emit();
    }
    render() {
        return (index.h("div", { key: '4a1b443ece43d7fbb08737610d76db5408e46b9d', class: Object.assign({ 'digi-tools-feedback': true }, this.cssModifiers) }, this.afType === typographyVariation_enum.ToolsFeedbackType.FULLWIDTH && (index.h("digi-layout-block", { key: 'c9dcaae2ef5c7cb2c502891f1c3dc3f86529467a', afVariation: layoutBlockVariation_enum.LayoutBlockVariation.TRANSPARENT }, this.content)), this.afType !== typographyVariation_enum.ToolsFeedbackType.FULLWIDTH && this.content));
    }
    get hostElement() { return index.getElement(this); }
    static get watchers() { return {
        "afIsDone": ["afIsDoneHandler"]
    }; }
};
ToolsFeedback.style = DigiToolsFeedbackStyle0;

exports.digi_tools_feedback = ToolsFeedback;
