adp-web-components 0.0.65 → 0.0.67

package/dist/collection/components/vehicle-lookup/dynamic-claim.js

@@ -0,0 +1,662 @@
+/*!
+ * Built by ShiftSoftware
+ * Copyright (c)
+ */
+import { Host, h } from "@stencil/core";
+import cn from "../../global/lib/cn";
+import { getLocaleLanguage } from "../../global/lib/get-local-language";
+import expiredIcon from "./assets/expired.svg";
+import pendingIcon from "./assets/pending.svg";
+import cancelledIcon from "./assets/cancelled.svg";
+import processedIcon from "./assets/processed.svg";
+import { localeSchema } from "../../global/types/locales/index";
+import { getVehicleInformation } from "../../global/api/vehicleInformation";
+let mockData = {};
+const icons = {
+    expired: expiredIcon,
+    pending: pendingIcon,
+    processed: processedIcon,
+    cancelled: cancelledIcon,
+};
+export class DynamicClaim {
+    constructor() {
+        this.pendingItemHighlighted = false;
+        this.onMouseLeave = () => {
+            clearTimeout(this.timeoutRef);
+            this.popupClasses = '';
+            this.timeoutRef = setTimeout(() => {
+                this.activePopupIndex = null;
+            }, 400);
+        };
+        this.onMouseEnter = (dynamicClaimItemHeader, idx) => {
+            clearTimeout(this.timeoutRef);
+            this.activePopupIndex = idx;
+            this.timeoutRef = setTimeout(() => {
+                const positionRef = dynamicClaimItemHeader.querySelector('.popup-position-ref');
+                this.popupPositionRef = positionRef;
+                this.calculatePopupPos(this.el.shadowRoot);
+                this.popupClasses = 'show';
+            }, 50);
+        };
+        this.baseUrl = undefined;
+        this.isDev = false;
+        this.queryString = '';
+        this.claimEndPoint = 'api/vehicle/swift-claim';
+        this.headers = {};
+        this.language = 'en';
+        this.errorCallback = undefined;
+        this.loadingStateChange = undefined;
+        this.loadedResponse = undefined;
+        this.locale = localeSchema.getDefault();
+        this.isIdle = true;
+        this.popupClasses = '';
+        this.isLoading = false;
+        this.externalVin = null;
+        this.errorMessage = null;
+        this.activePopupIndex = null;
+        this.vehicleInformation = undefined;
+    }
+    async componentWillLoad() {
+        await this.changeLanguage(this.language);
+    }
+    async changeLanguage(newLanguage) {
+        this.locale = await getLocaleLanguage(newLanguage);
+    }
+    async componentDidLoad() {
+        this.dynamicClaimBody = this.el.shadowRoot.querySelector('.dynamic-claim-body');
+        this.dynamicRedeem = this.el.shadowRoot.getElementById('dynamic-redeem');
+        this.dynamicClaimProgressBar = this.el.shadowRoot.querySelector('.dynamic-claim-progress-bar');
+    }
+    async setMockData(newMockData) {
+        mockData = newMockData;
+    }
+    async setData(newData, headers = {}) {
+        clearTimeout(this.networkTimeoutRef);
+        if (this.abortController)
+            this.abortController.abort();
+        this.abortController = new AbortController();
+        let scopedTimeoutRef;
+        const isVinRequest = typeof newData === 'string';
+        const vin = isVinRequest ? newData : newData === null || newData === void 0 ? void 0 : newData.vin;
+        this.externalVin = vin;
+        try {
+            if (!vin || vin.trim().length === 0) {
+                this.isIdle = true;
+                return;
+            }
+            this.isLoading = true;
+            this.isIdle = false;
+            await new Promise(r => {
+                scopedTimeoutRef = setTimeout(r, 1000);
+                this.networkTimeoutRef = scopedTimeoutRef;
+            });
+            const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData }, headers) : newData;
+            if (this.networkTimeoutRef === scopedTimeoutRef) {
+                if (!vehicleResponse)
+                    throw new Error('wrongResponseFormat');
+                if (!Array.isArray(vehicleResponse.serviceItems))
+                    throw new Error('noServiceAvailable');
+                this.vehicleInformation = vehicleResponse;
+            }
+            this.errorMessage = null;
+            this.isLoading = false;
+        }
+        catch (error) {
+            if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
+                return;
+            if (this.errorCallback)
+                this.errorCallback(error.message);
+            console.error(error);
+            this.setErrorMessage(error.message);
+        }
+    }
+    async setErrorMessage(message) {
+        this.isIdle = false;
+        this.isLoading = false;
+        this.vehicleInformation = null;
+        this.errorMessage = message;
+    }
+    async fetchData(requestedVin = this.externalVin, headers = {}) {
+        await this.setData(requestedVin, headers);
+    }
+    onLoadingChange(newValue) {
+        if (this.loadingStateChange)
+            this.loadingStateChange(newValue);
+        this.setLoadingUi(newValue);
+    }
+    async setLoadingUi(isLoading) {
+        if (!isLoading) {
+            this.dynamicClaimProgressBar.style.width = '0';
+            await new Promise(r => setTimeout(r, 200));
+            this.updateProgressBar();
+        }
+    }
+    updateProgressBar() {
+        var _a;
+        const serviceItems = ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceItems) || [];
+        if (serviceItems.filter(x => x.status === 'pending').length === 0) {
+            if (serviceItems.length === 0)
+                this.dynamicClaimProgressBar.style.width = '0%';
+            else
+                this.dynamicClaimProgressBar.style.width = '100%';
+            this.dynamicClaimBody.scrollTo({
+                left: this.dynamicClaimBody.scrollWidth,
+                behavior: 'smooth',
+            });
+        }
+        else {
+            const firstPendingItem = serviceItems.find(x => x.status === 'pending');
+            const firstPendingItemIndex = serviceItems.indexOf(firstPendingItem) + 1;
+            const firstPendingItemRef = this.dynamicClaimBody.getElementsByClassName('dynamic-claim-item')[firstPendingItemIndex - 1];
+            this.dynamicClaimProgressBar.style.width = (firstPendingItemIndex / serviceItems.length - 1 / (serviceItems.length * 2)) * 100 + '%';
+            this.dynamicClaimBody.scrollTo({
+                left: firstPendingItemRef.offsetLeft - firstPendingItemRef.clientWidth * 3,
+                behavior: 'smooth',
+            });
+        }
+    }
+    resetProgressBar() {
+        setTimeout(() => {
+            this.updateProgressBar();
+        }, 100);
+    }
+    windowScrollListener(newValue) {
+        if (newValue) {
+            this.scrollListenerRef = () => this.calculatePopupPos(this.el.shadowRoot);
+            window.addEventListener('scroll', this.scrollListenerRef);
+            this.dynamicClaimBody.addEventListener('scroll', this.scrollListenerRef);
+        }
+        else {
+            window.removeEventListener('scroll', this.scrollListenerRef);
+            this.dynamicClaimBody.removeEventListener('scroll', this.scrollListenerRef);
+        }
+    }
+    calculatePopupPos(root) {
+        const popupPositionRef = root.querySelector('.popup-position-ref');
+        let { x, y } = popupPositionRef.getBoundingClientRect();
+        const popupContainer = popupPositionRef.querySelector('.popup-container');
+        const { width } = popupContainer.getBoundingClientRect();
+        const popupInfo = popupContainer.querySelector('.dynamic-claim-item-popup-info');
+        const windowWidth = window.innerWidth; // Get the viewport's width
+        popupContainer.style.top = `${y}px`;
+        popupContainer.style.left = `${x - width / 2}px`;
+        const offsetFromLeft = x - width / 2; // Distance from left side of the viewport
+        const offsetFromRight = windowWidth - (x + width / 2); // Distance from right side of the viewport
+        let movingNeeded = 0;
+        let horizontalMargin = 16;
+        if (offsetFromRight < horizontalMargin)
+            movingNeeded = offsetFromRight - horizontalMargin;
+        else if (offsetFromLeft < horizontalMargin)
+            movingNeeded = Math.abs(offsetFromLeft - horizontalMargin);
+        popupInfo.style.transform = `translateX(${movingNeeded}px)`;
+    }
+    removeLoadAnimationClass(event) {
+        const component = event.target;
+        component.classList.remove('load-animation');
+    }
+    async completeClaim() {
+        var _a;
+        const serviceItems = ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceItems) || [];
+        const item = this.cachedClaimItem;
+        const serviceDataClone = JSON.parse(JSON.stringify(serviceItems));
+        const index = serviceItems.indexOf(item);
+        const pendingItemsBefore = serviceDataClone.slice(0, index).filter(x => x.status === 'pending');
+        serviceDataClone[index].status = 'processed';
+        pendingItemsBefore.forEach(function (otherItem) {
+            otherItem.status = 'cancelled';
+        });
+        this.pendingItemHighlighted = false;
+        const vehicleDataClone = JSON.parse(JSON.stringify(this.vehicleInformation));
+        vehicleDataClone.serviceItems = serviceDataClone;
+        this.vehicleInformation = JSON.parse(JSON.stringify(vehicleDataClone));
+    }
+    claim(item) {
+        var _a;
+        const serviceItems = ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceItems) || [];
+        const vinDataClone = JSON.parse(JSON.stringify(serviceItems));
+        const index = serviceItems.indexOf(item);
+        //Find other items before this item that have status 'pending'
+        let pendingItemsBefore = vinDataClone.slice(0, index).filter(x => x.status === 'pending');
+        this.cachedClaimItem = item;
+        if (item.maximumMileage === null) {
+            pendingItemsBefore = [];
+        }
+        this.onMouseLeave();
+        this.openRedeem(item, pendingItemsBefore);
+    }
+    async handleRedeemScanner() {
+        if (this.isDev) {
+            this.dynamicRedeem.handleScanner = async (_) => {
+                await new Promise(r => setTimeout(r, 500));
+                this.dynamicRedeem.quite();
+                this.completeClaim();
+                this.dynamicRedeem.handleScanner = null;
+            };
+        }
+        else {
+            this.dynamicRedeem.handleScanner = async (code, jobNumber) => {
+                try {
+                    const vehicleInformation = this.vehicleInformation;
+                    const payload = {
+                        vin: vehicleInformation.vin,
+                        brandIntegrationID: vehicleInformation.identifiers.brandIntegrationID,
+                        invoice: code,
+                        jobNumber: jobNumber,
+                        saleInformation: vehicleInformation.saleInformation,
+                        serviceItem: this.dynamicRedeem.item,
+                        cancelledServiceItems: this.dynamicRedeem.canceledItems,
+                    };
+                    const response = await fetch(this.claimEndPoint, {
+                        method: 'POST',
+                        headers: Object.assign({ 'Content-Type': 'application/json' }, this.headers),
+                        body: JSON.stringify(payload),
+                    });
+                    const data = await response.json();
+                    if (!data.Success) {
+                        alert(data.Message);
+                        this.dynamicRedeem.quite();
+                        this.dynamicRedeem.handleScanner = null;
+                        return;
+                    }
+                    this.dynamicRedeem.quite();
+                    this.completeClaim();
+                    this.dynamicRedeem.handleScanner = null;
+                }
+                catch (error) {
+                    console.error(error);
+                    alert(this.locale.errors.requestFailedPleaseTryAgainLater);
+                    this.dynamicRedeem.quite();
+                    this.dynamicRedeem.handleScanner = null;
+                }
+            };
+        }
+    }
+    openRedeem(item, oldItems) {
+        var _a, _b, _c, _d, _e;
+        const vehicleInformation = this.vehicleInformation;
+        this.dynamicRedeem.vin = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.vin;
+        this.dynamicRedeem.item = item;
+        this.dynamicRedeem.canceledItems = oldItems;
+        if (((_a = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _a === void 0 ? void 0 : _a.broker) !== null && ((_c = (_b = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _b === void 0 ? void 0 : _b.broker) === null || _c === void 0 ? void 0 : _c.invoiceDate) === null)
+            this.dynamicRedeem.unInvoicedByBrokerName = (_e = (_d = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _d === void 0 ? void 0 : _d.broker) === null || _e === void 0 ? void 0 : _e.brokerName;
+        else
+            this.dynamicRedeem.unInvoicedByBrokerName = null;
+        this.handleRedeemScanner();
+    }
+    createPopup(item) {
+        const texts = this.locale.vehicleLookup.dynamicClaim;
+        return (h("div", { dir: this.locale.direction, class: "popup-position-ref" }, h("div", { class: "popup-container" }, h("div", { class: cn('dynamic-claim-item-popup-info-triangle', this.popupClasses) }, h("div", { class: "dynamic-claim-item-popup-info-triangle-up" }), h("div", { class: "dynamic-claim-item-popup-info-triangle-up2" })), h("div", { class: cn('dynamic-claim-item-popup-info', this.popupClasses) }, h("table", null, h("tbody", null, h("tr", null, h("th", null, texts.serviceType), h("td", null, item.type.charAt(0).toUpperCase() + item.type.slice(1))), h("tr", null, h("th", null, texts.activationDate), h("td", null, item.activatedAt)), h("tr", null, h("th", null, texts.expireDate), h("td", null, item.expiresAt)), h("tr", null, h("th", null, texts.claimAt), h("td", null, item.redeemDate)), h("tr", null, h("th", null, texts.redeemingDealer), h("td", null, item.companyName)), h("tr", null, h("th", null, texts.invoiceNumber), h("td", null, item.invoiceNumber)), h("tr", null, h("th", null, texts.jobNumber), h("td", null, item.jobNumber)), h("tr", null, h("th", null, texts.packageCode), h("td", null, item.packageCode)))), item.status === 'pending' && (h("button", { onClick: () => this.claim(item), class: "claim-button dynamic-claim-button" }, h("svg", { width: "30px", height: "30px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { "stroke-width": "0" }), h("g", { "stroke-linecap": "round", "stroke-linejoin": "round" }), h("g", null, h("circle", { cx: "12", cy: "12", r: "8", "fill-opacity": "0.24" }), h("path", { d: "M8.5 11L11.3939 13.8939C11.4525 13.9525 11.5475 13.9525 11.6061 13.8939L19.5 6", "stroke-width": "1.2" }))), h("span", null, texts.claim)))))));
+    }
+    render() {
+        var _a, _b;
+        const serviceItems = ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceItems) || [];
+        const texts = this.locale.vehicleLookup.dynamicClaim;
+        console.log(this.errorMessage);
+        return (h(Host, { key: 'a393433eb4e9c57895fc8126fc0b8d5d629913a3' }, h("dynamic-redeem", { key: 'f93a0c9ff9d39ac4aaf893b2efce6f05afeaf9f7', language: this.language, id: "dynamic-redeem" }), h("div", { key: 'a0c1f1f5959f038f4a55060ad4279d763a58f064', class: cn('dynamic-claim-wrapper', { loading: this.isLoading, idle: this.isIdle }) }, h("div", { key: '44366a30268e2d6a8fb92dba274c3fb689b6bd58', class: "dynamic-claim-header" }, h("strong", { key: 'db752956f94b83fb324478b6fd938c6ac0de5045', onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-header-vin load-animation" }, this.errorMessage && (h("span", { key: '212a0a4dfb8952e1a65815deb9d523ea6ee2fe4a', dir: this.locale.direction, style: { color: 'red' } }, this.locale.errors[this.errorMessage] || this.locale.errors.wildCard)), !this.errorMessage && ((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vin))), h("div", { key: '778a2fa41e7e8472204d54c0d5ed9c9e052fff90', class: "dynamic-claim-body" }, h("div", { key: '203165e4821b2ecfb5dc4c504d8fd09aadf87c10', class: "loading-lane" }, h("div", { key: '511c255ad2a48a0feec5fabfcdf9f2a5cc4e8243', class: "dynamic-claim-loading-slider" }, h("div", { key: 'eb5f120b80782c08f6df830950acf5ccb5068561', class: "dynamic-claim-loading-slider-line" }), h("div", { key: 'a93d1cc4422b74faf31b4092d08f9b3f68eb2f8a', class: "dynamic-claim-loading-slider-subline dynamic-claim-inc" }), h("div", { key: '4f943ced058d86ab17309dc6f8a639a7ac35a3f0', class: "dynamic-claim-loading-slider-subline dynamic-claim-dec" }))), h("div", { key: 'd5c041fad9204aaa0b46cb6b50767346c6b3a1f1', class: "dynamic-claim-progress-lane" }, serviceItems.map((item, idx) => {
+            let statusClass = '';
+            if (item.status === 'pending') {
+                if (serviceItems.findIndex(i => i.status === 'pending') === idx)
+                    statusClass = item.status;
+            }
+            else
+                statusClass = item.status;
+            return (h("div", { key: item.name, class: cn('dynamic-claim-item', statusClass), onMouseLeave: this.onMouseLeave }, h("div", { onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-item-header load-animation", onMouseEnter: event => this.onMouseEnter(event.target, idx) }, h("img", { src: icons[item.status], alt: "status icon" }), h("span", null, texts[item.status]), this.activePopupIndex === idx && this.createPopup(item)), h("div", { onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-item-circle load-animation" }), h("p", { onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-item-footer load-animation" }, item.name)));
+        }), h("div", { key: '38e694a400929bc65503f58be5d66ee63e4f36b7', class: "dynamic-claim-progress-bar" }))))));
+    }
+    static get is() { return "dynamic-claim"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["dynamic-claim.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["dynamic-claim.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "baseUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "base-url",
+                "reflect": false
+            },
+            "isDev": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "is-dev",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "queryString": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "query-string",
+                "reflect": false,
+                "defaultValue": "''"
+            },
+            "claimEndPoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "claim-end-point",
+                "reflect": false,
+                "defaultValue": "'api/vehicle/swift-claim'"
+            },
+            "headers": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "headers",
+                "reflect": false,
+                "defaultValue": "{}"
+            },
+            "language": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "LanguageKeys",
+                    "resolved": "\"ar\" | \"en\" | \"ku\" | \"ru\"",
+                    "references": {
+                        "LanguageKeys": {
+                            "location": "import",
+                            "path": "~types/locales",
+                            "id": "src/global/types/locales/index.ts::LanguageKeys"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "language",
+                "reflect": false,
+                "defaultValue": "'en'"
+            },
+            "errorCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(errorMessage: ErrorKeys) => void",
+                    "resolved": "(errorMessage: ErrorKeys) => void",
+                    "references": {
+                        "ErrorKeys": {
+                            "location": "import",
+                            "path": "~types/locales",
+                            "id": "src/global/types/locales/index.ts::ErrorKeys"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            },
+            "loadingStateChange": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(isLoading: boolean) => void",
+                    "resolved": "(isLoading: boolean) => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            },
+            "loadedResponse": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(response: VehicleInformation) => void",
+                    "resolved": "(response: VehicleInformation) => void",
+                    "references": {
+                        "VehicleInformation": {
+                            "location": "import",
+                            "path": "~types/vehicle-information",
+                            "id": "src/global/types/vehicle-information.ts::VehicleInformation"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            }
+        };
+    }
+    static get states() {
+        return {
+            "locale": {},
+            "isIdle": {},
+            "popupClasses": {},
+            "isLoading": {},
+            "externalVin": {},
+            "errorMessage": {},
+            "activePopupIndex": {},
+            "vehicleInformation": {}
+        };
+    }
+    static get methods() {
+        return {
+            "setMockData": {
+                "complexType": {
+                    "signature": "(newMockData: MockJson<VehicleInformation>) => Promise<void>",
+                    "parameters": [{
+                            "name": "newMockData",
+                            "type": "{ [key: string]: VehicleInformation; }",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "MockJson": {
+                            "location": "import",
+                            "path": "~types/components",
+                            "id": "src/global/types/components.ts::MockJson"
+                        },
+                        "VehicleInformation": {
+                            "location": "import",
+                            "path": "~types/vehicle-information",
+                            "id": "src/global/types/vehicle-information.ts::VehicleInformation"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
+            "setData": {
+                "complexType": {
+                    "signature": "(newData: VehicleInformation | string, headers?: any) => Promise<void>",
+                    "parameters": [{
+                            "name": "newData",
+                            "type": "string | VehicleInformation",
+                            "docs": ""
+                        }, {
+                            "name": "headers",
+                            "type": "any",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "VehicleInformation": {
+                            "location": "import",
+                            "path": "~types/vehicle-information",
+                            "id": "src/global/types/vehicle-information.ts::VehicleInformation"
+                        },
+                        "ReturnType": {
+                            "location": "global",
+                            "id": "global::ReturnType"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
+            "setErrorMessage": {
+                "complexType": {
+                    "signature": "(message: ErrorKeys) => Promise<void>",
+                    "parameters": [{
+                            "name": "message",
+                            "type": "OptionalKeys<{ wildCard: string; noBaseUrl: string; invalidVin: string; noPartsFound: string; vinNumberRequired: string; wrongFormStructure: string; partNumberRequired: string; noServiceAvailable: string; wrongResponseFormat: string; requestFailedPleaseTryAgainLater: string; }>",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "ErrorKeys": {
+                            "location": "import",
+                            "path": "~types/locales",
+                            "id": "src/global/types/locales/index.ts::ErrorKeys"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
+            "fetchData": {
+                "complexType": {
+                    "signature": "(requestedVin?: string, headers?: any) => Promise<void>",
+                    "parameters": [{
+                            "name": "requestedVin",
+                            "type": "string",
+                            "docs": ""
+                        }, {
+                            "name": "headers",
+                            "type": "any",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
+            "completeClaim": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "VehicleInformation": {
+                            "location": "import",
+                            "path": "~types/vehicle-information",
+                            "id": "src/global/types/vehicle-information.ts::VehicleInformation"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "language",
+                "methodName": "changeLanguage"
+            }, {
+                "propName": "isLoading",
+                "methodName": "onLoadingChange"
+            }, {
+                "propName": "vehicleInformation",
+                "methodName": "resetProgressBar"
+            }, {
+                "propName": "popupClasses",
+                "methodName": "windowScrollListener"
+            }];
+    }
+}