import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { d as defineCustomElement$2 } from './pn-marketweb-input2.js';

const translations = {
    sv: {
        heading: 'Prisindikation med PEX Bud',
        labelFrom: 'Från postkod',
        labelTo: 'Till postkod',
        zipPlaceholder: 'Ex. 12831',
        labelWeight: 'Vikt (i kilo)',
        weightPlaceholder: 'Ex. 1000',
        labelWhen: 'När',
        submitButtonText: 'Beräkna pris',
    },
    en: {
        heading: 'Calculate price with PEX Bud',
        labelFrom: 'From zip',
        labelTo: 'To zip',
        zipPlaceholder: 'Ex. 12831',
        labelWeight: 'Weight (in kilo)',
        weightPlaceholder: 'Ex. 1000',
        labelWhen: 'When',
        submitButtonText: 'Calculate price',
    },
};

const illustration = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 120 120"><g clip-path="url(#PEX-truck_svg__a)"><path fill="#8EDDF9" d="M0 60C0 26.863 26.863 0 60 0s60 26.863 60 60-26.863 60-60 60S0 93.137 0 60"/><path fill="#0D234B" fill-rule="evenodd" d="M-8 114.461c0-.311.253-.564.564-.564h278.872a.565.565 0 0 1 0 1.128H-7.436a.564.564 0 0 1-.564-.564" clip-rule="evenodd"/><path fill="#000" d="M95.087 114.912c6.804 0 12.319-5.515 12.319-12.319s-5.515-12.32-12.319-12.32c-6.803 0-12.319 5.516-12.319 12.32s5.516 12.319 12.32 12.319"/><path fill="#D3CECB" d="M174.689 105.436H65.757V22h98.463c5.776 0 10.469 4.693 10.469 10.469z"/><path fill="#F3F2F2" d="M133.67 105.436H25.416V32.469C25.416 26.693 30.108 22 35.885 22h97.83v83.436z"/><path fill="#2D2013" d="M65.983 105.436H25.416V32.469C25.416 26.693 30.108 22 35.885 22h94.672z"/><path fill="#000" d="M233.486 106.429H21.264v-4.242a3.235 3.235 0 0 1 3.249-3.249h205.769a3.235 3.235 0 0 1 3.249 3.249v4.242z"/><path fill="#5E554A" fill-rule="evenodd" d="M30.56 88.763h-5.144v-1.128h5.144c1.906 0 3.316 1.715 3.316 3.632 0 1.968-1.415 3.633-3.316 3.633h-5.144v-1.128h5.144c1.167 0 2.188-1.043 2.188-2.505 0-1.422-1.026-2.504-2.188-2.504" clip-rule="evenodd"/><path fill="#00A0D6" d="M63.995 98.848 123.334 22h9.431L73.381 98.938z"/><path fill="#A7A6A6" d="m62.597 22 9.521.045 21.795 28.203-4.783 6.137zM97.706 67.486l4.647-6.092 28.925 37.454-9.295.09z"/><path fill="#000" d="M70.764 105.436H39.493v-3.43c0-8.618 6.994-15.658 15.658-15.658 8.619 0 15.658 6.995 15.658 15.658v3.43z"/><path fill="#000" d="M55.108 114.912c6.804 0 12.32-5.515 12.32-12.319s-5.516-12.32-12.32-12.32c-6.803 0-12.319 5.516-12.319 12.32s5.515 12.319 12.32 12.319"/><path fill="#5E554A" d="M55.017 107.647a5.054 5.054 0 1 0 0-10.108 5.054 5.054 0 0 0 0 10.108"/><path fill="#fff" d="M58.583 58.595h-6.498v1.354h6.498z"/><path fill="#fff" d="M49.466 52.144v14.71h11.19v-1.353H51V53.497h9.386v-1.353zM36.154 66.854v-14.71h5.912c3.52 0 5.234 1.398 5.234 4.286 0 2.979-1.715 4.468-5.234 4.468h-3.294v-1.354h3.294c2.617 0 3.79-.948 3.79-3.068 0-2.076-1.173-2.979-3.79-2.979h-4.378v13.357z"/><path fill="#1798D5" d="m61.877 66.854 11.551-14.71h1.805l-11.506 14.71z"/><path fill="#fff" d="m61.605 52.099 1.85.045 4.241 5.37-.902 1.173zM68.42 60.808l.902-1.128 5.64 7.175h-1.805zM60.522 70.735c0 .586-.406.993-.948.993-.36 0-.496-.18-.496-.18l-.045-.046v.722h-.677v-2.437h.677v.226l.045-.045s.18-.226.587-.226c.496-.045.857.361.857.993m-.722 0c0-.27-.18-.406-.406-.406a.404.404 0 0 0-.406.406c0 .225.18.406.406.406s.406-.18.406-.406m3.068-.045c0 .722-.541.992-1.128.992-.496 0-1.083-.27-1.083-.992s.542-.993 1.129-.993c.541 0 1.082.316 1.082.993m-.676.045c0-.27-.18-.406-.407-.406a.404.404 0 0 0-.406.406c0 .225.18.406.407.406.225 0 .406-.18.406-.406m1.85-.27h-.09c-.181-.046-.271-.046-.271-.136 0-.136.18-.136.316-.136.27 0 .496.09.586.09l.09-.496c-.09 0-.36-.09-.676-.09-.632 0-.993.226-.993.677 0 .316.225.496.722.586.225.046.36.046.36.136 0 .135-.135.135-.27.135-.316 0-.587-.09-.677-.135l-.135.496c.09.045.36.09.722.09.677 0 1.038-.225 1.038-.676 0-.226-.09-.452-.722-.542m1.58-1.13h-.678v2.302h.677V70.33h.361l.316-.542h-.632v-.451zM74.466 69.2v2.482h-.677v-.226l-.045.046s-.18.225-.542.225c-.541 0-.902-.406-.902-.993 0-.586.406-.992.947-.992.361 0 .497.18.497.18l.045.045v-.631zm-.632 1.49a.404.404 0 0 0-.406-.407.404.404 0 0 0-.406.406c0 .271.18.406.406.406.27.046.406-.135.406-.406M70.72 70.69c0 .722-.54.992-1.127.992-.497 0-1.083-.27-1.083-.993 0-.721.541-.992 1.128-.992.541 0 1.083.316 1.083.992m-.676.045c0-.271-.18-.406-.406-.406a.404.404 0 0 0-.406.406c0 .225.18.406.406.406.225 0 .406-.18.406-.406M72.028 70.33c.09 0 .18 0 .226.044v-.586h-.136c-.36 0-.496.225-.496.225l-.045.09v-.315H70.9v1.895h.677v-.903c0-.316.18-.45.451-.45M67.607 69.697c-.406 0-.541.225-.541.225l-.045.09v-.27h-.677v1.895h.677v-.948c0-.27.09-.36.316-.36.27 0 .27.225.27.45v.903h.677V70.51q0-.812-.677-.812"/></g><defs><clipPath id="PEX-truck_svg__a"><path fill="#fff" d="M0 60C0 26.863 26.863 0 60 0s60 26.863 60 60-26.863 60-60 60S0 93.137 0 60"/></clipPath></defs></svg>';
const PEX_truck = illustration;

const pnPexPricefinderCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.pex-pricefinder-top{display:flex;align-items:center}.pex-pricefinder-top pn-illustration{width:5.5rem;height:5.5rem;margin-right:1.6rem}.pex-pricefinder-form{margin:1.6rem 0 0 0;padding:0;border:0}.pex-pricefinder-form fieldset{margin:0;padding:0;border:0}.pex-pricefinder-form fieldset+fieldset{margin-top:1.6rem}.pex-pricefinder-form fieldset>div{display:flex;align-items:center;gap:1em}.pex-pricefinder-form fieldset>div>*{flex-grow:1;width:100%}.pex-pricefinder-form pn-button{align-self:end;margin-left:auto}.pex-pricefinder-form .datepicker{display:inline-flex;flex-direction:column}.pex-pricefinder-form .datepicker label{margin-bottom:0.4rem;color:#5e554a;font-size:0.875em;display:flex;justify-content:space-between;align-items:flex-end;cursor:pointer;transition:color 0.2s}.pex-pricefinder-form .datepicker pn-date-picker{width:100%}.pex-pricefinder-response{margin-top:2.4rem;text-align:center;font-size:2.4em}";
const PnPexPricefinderStyle0 = pnPexPricefinderCss;

const PnPexPricefinder$1 = /*@__PURE__*/ proxyCustomElement(class PnPexPricefinder extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.language = 'sv';
        this.currency = 'Kr';
        this.apiUrl = '/api/pex/order';
        this.i18n = translations.sv;
        this.fromzip = null;
        this.tozip = null;
        this.weight = 1;
        this.when = '';
        this.response = null;
    }
    get hostElement() { return this; }
    componentWillLoad() {
        this.init();
    }
    async init() {
        this.setInitialTime();
        this.checkParameters();
        this.setLanguage();
    }
    setInitialTime() {
        const initialTime = new Date();
        initialTime.setHours(initialTime.getHours() + 1);
        initialTime.setMinutes(0);
        const splitTime = initialTime.toLocaleString('sv', { timeZoneName: 'short' }).split(' ');
        this.when = `${splitTime[0]}T${splitTime[1].substring(0, 5)}`;
    }
    checkParameters() {
        const params = new URLSearchParams(window.location.href);
        if (!params) {
            return;
        }
        const paramKeys = ['fromzip', 'tozip', 'weight', 'when'];
        paramKeys.forEach(key => {
            if (params.get(key)) {
                this[key] = params.get(key);
            }
        });
    }
    setLanguage() {
        if (translations[this.language]) {
            this.i18n = translations[this.language];
        }
    }
    onSubmit(e) {
        e.preventDefault();
        const formData = new FormData(e.target);
        const requestQuery = this.compileRequestQuery(formData);
        this.fetchResult(requestQuery);
    }
    compileRequestQuery(formData) {
        let query = {
            from: formData.get('fromzip'),
            to: formData.get('tozip'),
            weight: formData.get('weight'),
            when: formData.get('when'),
        };
        if (!query.when) {
            query.when = this.hostElement.querySelector('input.date-input').value;
        }
        if (!formData.get('fromzip') || !formData.get('tozip') || !formData.get('weight')) {
            console.error('Form data is not compliant');
            return;
        }
        return query;
    }
    async fetchResult(query) {
        this.response = null;
        const params = new URLSearchParams(query);
        const req = await fetch(`${this.apiUrl}?${params.toString()}`, {
            method: 'get',
            headers: {
                'Content-Type': 'application/json',
            },
        }).catch(this.onFetchError.bind(this));
        let response = await req.json().catch(this.onFetchError.bind(this));
        if (!response) {
            response = await (await import('./mockresponse.js')).default;
        }
        if (response) {
            this.response = response;
        }
    }
    onFetchError(error) {
        console.error('onFetchError(error', error);
    }
    render() {
        return (h(Host, { key: '07ebd8d6255c1152a3c391462055d5de2cc732fd' }, h("div", { key: 'da47c58cdbf755ee85bc5a951f8b9f5811279097', class: "pex-pricefinder-top" }, h("pn-illustration", { key: '47edf0059307429874abb8847f1f8e4e705f945f', illustration: PEX_truck }), h("h2", { key: '62c2de74f8faad097c11349908d9392178a0f4f7' }, this.i18n.heading)), h("form", { key: '08678b12dee5299dbdea1567ebd244b3643b26f7', method: "get", action: "", class: "pex-pricefinder-form", onSubmit: this.onSubmit.bind(this) }, h("fieldset", { key: '9b4ccb866040e402630130d0c2d6c3d0fda95789' }, h("div", { key: '1c6a287986bbad27e96307f70a0301bdb104aecb' }, h("pn-input", { key: '36a46d8941bc7d0b9b52e76d50208664f8b84336', type: "number", label: this.i18n.labelFrom, inputid: "fromzip", name: "fromzip", placeholder: this.i18n.zipPlaceholder, required: true, value: this.fromzip }), h("pn-input", { key: 'e05764b4de7dbd58148e073097047a4326afa92e', type: "number", label: this.i18n.labelTo, inputid: "tozip", name: "tozip", placeholder: this.i18n.zipPlaceholder, required: true, value: this.tozip }))), h("fieldset", { key: 'f41afe2b0fe4d6aaaf7e77b78c0fd240d6a963c5' }, h("div", { key: '2a6a2785b70b4a3d4d78bc9c18ef31d7902442cf' }, h("pn-input", { key: 'b2e1b8fde55ad622c4b09954a7039cd40d405c3a', type: "number", label: this.i18n.labelWeight, inputid: "weight", name: "weight", placeholder: this.i18n.weightPlaceholder, required: true, value: this.weight }), h("div", { key: '68361172baa45049917667b4f5a02d9b1d9155ae', class: "datepicker" }, h("label", { key: '390e0c47251f75ea230c3c6ef54b6e081193a7af', htmlFor: "when" }, this.i18n.labelWhen), h("pn-marketweb-input", { key: '09da4ba47f8a6b309f790114f4cf123457f55c38', inputid: "when", name: "when", type: "datetime-local", min: new Date().toISOString().split('T')[0], value: this.when })))), h("fieldset", { key: 'def4b4966f36bce8682ae2f1c7c90c315cd8cb17' }, h("div", { key: '072a781a61287d51b515449405fd8c6c5e751b8c' }, h("pn-button", { key: 'e10166d33057271cca7d77efa7e473c6f79d3ec5', type: "submit" }, this.i18n.submitButtonText)))), this.response ? (h("div", { class: "pex-pricefinder-response" }, h("strong", null, this.response.data.value, " ", this.currency))) : null));
    }
    static get style() { return PnPexPricefinderStyle0; }
}, [0, "pn-pex-pricefinder", {
        "language": [1],
        "currency": [1],
        "apiUrl": [1, "api-url"],
        "i18n": [32],
        "fromzip": [32],
        "tozip": [32],
        "weight": [32],
        "when": [32],
        "response": [32]
    }, [[0, "language", "setLanguage"]]]);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["pn-pex-pricefinder", "pn-marketweb-input"];
    components.forEach(tagName => { switch (tagName) {
        case "pn-pex-pricefinder":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, PnPexPricefinder$1);
            }
            break;
        case "pn-marketweb-input":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
    } });
}

const PnPexPricefinder = PnPexPricefinder$1;
const defineCustomElement = defineCustomElement$1;

export { PnPexPricefinder, defineCustomElement };

//# sourceMappingURL=pn-pex-pricefinder.js.map