adp-web-components 0.0.90 → 0.0.92

package/dist/collection/components/vehicle-lookup/vehicle-item-claim-form.js

@@ -2,267 +2,255 @@
  * Built by ShiftSoftware
  * Copyright (c)
  */
-import { Host, h } from "@stencil/core";
 import cn from "../../global/lib/cn";
-import { getSharedLocal, sharedLocalesSchema } from "../../global/lib/get-local-language";
-import { claimFormSchema } from "../../locales/vehicleLookup/claimableItems/type";
+import { Host, h } from "@stencil/core";
+import { MaterialCard } from "../components/material-card";
+import { closeImageViewer, ImageViewer, openImageViewer } from "../../features/image-viewer/index";
+import { AddIcon } from "../../global/assets/add-icon";
+import { AlertIcon } from "../../global/assets/alert-icon";
+import { CheckIcon } from "../../global/assets/check-icon";
+import { AttachIcon } from "../../global/assets/attach-icon";
+import { FormSubmitSVG } from "../../global/assets/form-submit-svg";
+import { ActivationIcon } from "../../global/assets/activation-icon";
+import { PrintIcon } from "../../global/assets/print-icon";
+import Eye from "~assets/eye.svg";
 export class VehicleItemClaimForm {
     constructor() {
-        this.vin = '';
-        this.language = 'en';
-        this.item = null;
-        this.unInvoicedByBrokerName = null;
-        this.canceledItems = null;
-        this.locale = claimFormSchema.getDefault();
-        this.claimViaBarcodeScanner = false;
-        this.sharedLocales = sharedLocalesSchema.getDefault();
-        this.internalVin = '';
+        // ====== Start Image Viewer Logic
+        this.expandedImage = '';
+        this.uploadMultipleDocuments = true;
         this.uploadProgress = 0;
-        this.isLoading = false;
         this.isOpened = false;
-        this.isDocumentError = false;
-        this.selectedFile = null;
-        this.internalItem = null;
-        this.confirmServiceCancellation = false;
-        this.confirmUnInvoicedTBPVehicles = false;
-        this.internalCanceledItem = null;
-        this.documentError = 'documentRequiredError';
-        this.readyToClaim = false;
-        this.qrCode = null;
-        this.invoice = null;
-        this.job = null;
-        this.closeModal = async () => {
-            this.isOpened = false;
-            this.item = null;
-            await new Promise(r => setTimeout(r, 500));
-            this.canceledItems = [];
-            this.unInvoicedByBrokerName = null;
-            if (this.claimViaBarcodeScanner) {
-                this.qrInput.value = '';
-                this.qrInput.readOnly = false;
+        this.isLoading = false;
+        this.confirmationStates = {};
+        this.errors = {};
+        this.inputs = {
+            documents: [],
+        };
+        this.setErrorValue = (errorName, value) => {
+            const previousError = (this.errors[errorName] || {});
+            this.errors = Object.assign(Object.assign({}, this.errors), { [errorName]: Object.assign(Object.assign({}, previousError), value) });
+        };
+        this.setInputValue = (inputName, value) => {
+            this.inputs = Object.assign(Object.assign({}, this.inputs), { [inputName]: value });
+        };
+        this.onFileUploaderChange = (event) => {
+            var _a, _b, _c, _d, _e;
+            const input = event.target;
+            if (!input.files)
+                return;
+            const maxSize = parseInt(input.dataset.maxSize || '0', 10);
+            const newFiles = this.uploadMultipleDocuments ? Array.from(input.files) : [input.files[0]];
+            input.value = '';
+            let anyFileExceedsMaxSize = false;
+            const filteredNewFiles = newFiles.filter(newFile => {
+                var _a, _b;
+                const isFileSizeValid = newFile.size <= maxSize;
+                if (!isFileSizeValid) {
+                    anyFileExceedsMaxSize = true;
+                    return false;
+                }
+                const isFileAlreadyExists = (_b = (_a = this.inputs) === null || _a === void 0 ? void 0 : _a.documents) === null || _b === void 0 ? void 0 : _b.some(existingFile => existingFile.name === newFile.name && existingFile.size === newFile.size && existingFile.lastModified === newFile.lastModified);
+                return !isFileAlreadyExists;
+            });
+            this.setInputValue('documents', this.uploadMultipleDocuments ? [...(((_a = this.inputs) === null || _a === void 0 ? void 0 : _a.documents) || []), ...filteredNewFiles] : filteredNewFiles);
+            if (anyFileExceedsMaxSize) {
+                this.setErrorValue('documents', {
+                    show: true,
+                    text: 'documentLimitError',
+                });
+                return;
             }
-            else {
-                this.invoiceInput.value = '';
-                this.invoiceInput.readOnly = false;
-                this.jobInput.value = '';
-                this.jobInput.readOnly = false;
+            else if ((_b = this.errors) === null || _b === void 0 ? void 0 : _b.documents)
+                this.setErrorValue('documents', { text: (_c = this.errors.documents) === null || _c === void 0 ? void 0 : _c.text, show: false });
+            if (((_d = this.item) === null || _d === void 0 ? void 0 : _d.claimingMethodEnum) === 'ClaimByScanningQRCode') {
+                if ((_e = this.inputs) === null || _e === void 0 ? void 0 : _e.qrCode)
+                    this.submit();
             }
-            this.qrCode = null;
-            this.invoice = null;
-            this.job = null;
-            this.readyToClaim = false;
-            this.isLoading = false;
+            else
+                this.focusInputs();
         };
-        this.inputKeyDown = async (event) => {
+        this.onDocumentButtonClicked = () => {
+            const documentUploader = this.el.shadowRoot.querySelector('.document-uploader');
+            if (documentUploader)
+                documentUploader.click();
+        };
+        this.focusInputs = () => {
+            setTimeout(() => {
+                const inputs = this.el.shadowRoot.querySelectorAll('input[type="text"]');
+                const firstEnabled = Array.from(inputs).find(input => !input.disabled && !input.readOnly);
+                if (firstEnabled)
+                    firstEnabled.focus();
+            }, 50);
+        };
+        this.focusEmptyInputs = () => {
             var _a, _b;
-            if (event === null || event.key === 'Enter') {
-                if (!this.confirmServiceCancellation || !this.confirmUnInvoicedTBPVehicles)
-                    return;
-                if (event !== null)
-                    event === null || event === void 0 ? void 0 : event.preventDefault();
-                if (!(this === null || this === void 0 ? void 0 : this.handleClaiming))
-                    return;
-                if (!this.readyToClaim)
+            const inputs = this.el.shadowRoot.querySelectorAll('input[type="text"]');
+            const firstEmptyInput = Array.from(inputs).find(input => { var _a; return !((_a = input.value) === null || _a === void 0 ? void 0 : _a.trim()); });
+            if (firstEmptyInput)
+                firstEmptyInput.focus();
+            if (((_a = this.item) === null || _a === void 0 ? void 0 : _a.documentUploaderIsRequired) && !((_b = this.inputs) === null || _b === void 0 ? void 0 : _b.documents.length)) {
+                this.setErrorValue('documents', {
+                    show: true,
+                    text: 'documentRequiredError',
+                });
+            }
+        };
+        this.submit = async () => {
+            var _a, _b, _c, _d, _e, _f, _g, _h;
+            if (!this.getIsFormValid())
+                return this.focusEmptyInputs();
+            if (!this.getIsFormConfirmed())
+                return;
+            if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.showDocumentUploader) {
+                if (((_b = this.item) === null || _b === void 0 ? void 0 : _b.documentUploaderIsRequired) && !((_d = (_c = this.inputs) === null || _c === void 0 ? void 0 : _c.documents) === null || _d === void 0 ? void 0 : _d.length)) {
+                    this.setErrorValue('documents', {
+                        show: true,
+                        text: 'documentRequiredError',
+                    });
                     return;
-                if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.showDocumentUploader) {
-                    if (this.selectedFile && this.selectedFile.size > this.maximumDocumentFileSizeInMb * 1024 * 1024) {
-                        this.documentError = 'documentLimitError';
-                        this.isDocumentError = true;
-                        return;
-                    }
-                    if (((_b = this.item) === null || _b === void 0 ? void 0 : _b.documentUploaderIsRequired) && !this.selectedFile) {
-                        this.documentError = 'documentRequiredError';
-                        this.isDocumentError = true;
-                        return;
-                    }
-                }
-                this.readyToClaim = false;
-                if (this.claimViaBarcodeScanner) {
-                    this.qrInput.readOnly = true;
                 }
-                else {
-                    this.invoiceInput.readOnly = true;
-                    this.jobInput.readOnly = true;
-                }
-                this.isLoading = true;
-                await this.handleClaiming({ jobNumber: this.job, invoice: this.invoice, qrCode: this.qrCode, document: this.selectedFile });
-                this.isLoading = false;
-                this.readyToClaim = true;
             }
+            this.isLoading = true;
+            if (this.handleClaiming)
+                await this.handleClaiming({
+                    qrCode: (_e = this.inputs) === null || _e === void 0 ? void 0 : _e.qrCode,
+                    invoice: (_f = this.inputs) === null || _f === void 0 ? void 0 : _f.invoice,
+                    documents: (_g = this.inputs) === null || _g === void 0 ? void 0 : _g.documents,
+                    jobNumber: (_h = this.inputs) === null || _h === void 0 ? void 0 : _h.jobNumber,
+                });
+            this.close(true);
         };
-        this.registerFileUploader = () => {
-            var _a, _b;
-            (_a = this.documentButton) === null || _a === void 0 ? void 0 : _a.removeEventListener('click', this.onFileUploaderClick);
-            (_b = this.documentUploader) === null || _b === void 0 ? void 0 : _b.removeEventListener('change', this.onFileUploaderChange);
-            this.documentButton = this.el.shadowRoot.querySelector('.document-button');
-            this.documentUploader = this.el.shadowRoot.querySelector('.document-uploader');
-            if (!this.documentButton || !this.documentUploader)
-                return;
-            this.documentButton.addEventListener('click', this.onFileUploaderClick);
-            this.documentUploader.addEventListener('change', this.onFileUploaderChange);
+        this.onConfirmCheckboxChange = (confirmationName) => (event) => {
+            const target = event.target;
+            this.confirmationStates = Object.assign(Object.assign({}, this.confirmationStates), { [confirmationName]: target.checked });
+            if (this.getIsFormConfirmed)
+                this.focusInputs();
         };
-        this.onFileUploaderClick = () => {
-            this.documentUploader.click();
+        this.getIsFormConfirmed = () => {
+            var _a, _b;
+            if (Array.isArray((_a = this.item) === null || _a === void 0 ? void 0 : _a.warnings)) {
+                for (let idx = 0; idx < ((_b = this.item) === null || _b === void 0 ? void 0 : _b.warnings.length); idx++) {
+                    const warning = this.item.warnings[idx];
+                    if (!!(warning === null || warning === void 0 ? void 0 : warning.confirmationText) && !this.confirmationStates[warning.key])
+                        return false;
+                }
+            }
+            return true;
         };
-        this.onFileUploaderChange = (event) => {
-            var _a;
-            const input = event.target;
-            const file = (_a = input.files) === null || _a === void 0 ? void 0 : _a[0];
-            this.documentUploader.value = '';
-            if (!file)
-                return;
-            this.selectedFile = file;
-            if (this.selectedFile.size > this.maximumDocumentFileSizeInMb * 1024 * 1024) {
-                this.documentError = 'documentLimitError';
-                this.isDocumentError = true;
-                return;
+        this.getIsFormValid = () => {
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+            if (((_a = this.item) === null || _a === void 0 ? void 0 : _a.claimingMethodEnum) === 'ClaimByScanningQRCode') {
+                if (!((_c = (_b = this.inputs) === null || _b === void 0 ? void 0 : _b.qrCode) === null || _c === void 0 ? void 0 : _c.trim().length))
+                    return false;
             }
             else {
-                this.isDocumentError = false;
-                if (this.claimViaBarcodeScanner) {
-                    // @ts-ignore
-                    this.inputKeyDown({ key: 'Enter', preventDefault: () => { } });
-                }
+                if (!((_e = (_d = this.inputs) === null || _d === void 0 ? void 0 : _d.invoice) === null || _e === void 0 ? void 0 : _e.trim().length))
+                    return false;
+                if (!((_g = (_f = this.inputs) === null || _f === void 0 ? void 0 : _f.jobNumber) === null || _g === void 0 ? void 0 : _g.trim().length))
+                    return false;
             }
+            if (((_h = this.item) === null || _h === void 0 ? void 0 : _h.documentUploaderIsRequired) && !((_j = this.inputs) === null || _j === void 0 ? void 0 : _j.documents.length))
+                return false;
+            return true;
+        };
+        this.resetState = () => {
+            this.item = null;
+            this.errors = {};
+            this.inputs = {
+                documents: [],
+            };
+            this.isLoading = false;
+            this.confirmationStates = {};
         };
         this.clearFile = (event) => {
-            event.stopPropagation();
-            this.selectedFile = null;
-            this.isDocumentError = false;
+            var _a, _b, _c;
+            if (typeof event === 'number') {
+                const newDocuments = this.inputs.documents.filter((_, idx) => idx !== event);
+                this.setInputValue('documents', newDocuments);
+                if (((_a = this === null || this === void 0 ? void 0 : this.item) === null || _a === void 0 ? void 0 : _a.documentUploaderIsRequired) && !newDocuments.length) {
+                    this.setErrorValue('documents', {
+                        show: true,
+                        text: 'documentRequiredError',
+                    });
+                }
+            }
+            else {
+                event.stopPropagation();
+                this.setInputValue('documents', []);
+                if ((_b = this.errors) === null || _b === void 0 ? void 0 : _b.documents)
+                    this.setErrorValue('documents', { text: (_c = this.errors.documents) === null || _c === void 0 ? void 0 : _c.text, show: false });
+            }
+        };
+        this.onKeyDown = (event) => {
+            if (event.key === 'Enter')
+                this.submit();
         };
     }
-    async componentWillLoad() {
-        await this.changeLanguage(this.language);
+    onImageViewerToggles(newValue) {
+        window.removeEventListener('keydown', this.closeModalListenerRef);
+        console.log(newValue);
+        if (newValue === null) {
+            setTimeout(() => {
+                this.closeModalListenerRef = (event) => event.key === 'Escape' && this.close();
+                window.addEventListener('keydown', this.closeModalListenerRef);
+            }, 200);
+        }
     }
-    async changeLanguage(newLanguage) {
-        this.sharedLocales = await getSharedLocal(newLanguage);
+    async open() {
+        this.isOpened = true;
+        document.body.style.overflow = 'hidden';
+        this.focusInputs();
+        window.removeEventListener('keydown', this.closeModalListenerRef);
+        this.closeModalListenerRef = (event) => event.key === 'Escape' && this.close();
+        window.addEventListener('keydown', this.closeModalListenerRef);
     }
     onIsLoadingChange(newValue) {
         if (this.loadingStateChange)
             this.loadingStateChange(newValue);
     }
-    async componentDidLoad() {
-        this.dynamicClaimProcessor = this.el.shadowRoot.querySelector('.dynamic-claim-processor');
-        if (this.unInvoicedByBrokerName === null)
-            this.confirmUnInvoicedTBPVehicles = true;
-        else
-            this.confirmUnInvoicedTBPVehicles = false;
-    }
-    async componentDidRender() {
-        this.qrInput = this.el.shadowRoot.querySelector('.dynamic-claim-processor #qr-input');
-        this.invoiceInput = this.el.shadowRoot.querySelector('.dynamic-claim-processor #invoice-input');
-        this.jobInput = this.el.shadowRoot.querySelector('.dynamic-claim-processor #job-input');
-        this.registerFileUploader();
-    }
-    async changeInternalCanceledItem(newInternalCanceledItem) {
-        this.internalCanceledItem = newInternalCanceledItem;
-        if (this.internalCanceledItem.length > 0) {
-            this.confirmServiceCancellation = false;
-        }
-        else {
-            this.confirmServiceCancellation = true;
-        }
-    }
-    async changeConfirmUnInvoicedTBPVehicles(newUnInvoicedByBrokerName) {
-        if (newUnInvoicedByBrokerName === null) {
-            this.confirmUnInvoicedTBPVehicles = true;
-        }
-        else {
-            this.confirmUnInvoicedTBPVehicles = false;
-        }
-    }
-    async changeInternalVin(newInternalVin) {
-        this.internalVin = newInternalVin;
-    }
-    async changeInternalItem(newItem) {
-        var _a;
-        this.isOpened = !!newItem;
-        if (newItem)
-            this.internalItem = newItem;
-        this.claimViaBarcodeScanner = ((_a = this.item) === null || _a === void 0 ? void 0 : _a.claimingMethodEnum) === 'ClaimByScanningQRCode';
-        if (newItem) {
-            this.closeModalListenerRef = (event) => event.key === 'Escape' && this.quite();
-            window.addEventListener('keydown', this.closeModalListenerRef);
-            await new Promise(r => setTimeout(r, 300));
-            if (this.qrInput)
-                this.qrInput.focus();
-            if (this.invoiceInput)
-                this.invoiceInput.focus();
-        }
-        else {
-            window.removeEventListener('keydown', this.closeModalListenerRef);
-            this.quite();
-        }
-    }
-    async quite() {
-        this.closeModal();
-    }
-    async getQrValue() {
-        return this.invoiceInput.value;
-    }
-    updateReadyToClaim() {
-        var _a, _b, _c;
-        this.readyToClaim = false;
-        if (this.claimViaBarcodeScanner) {
-            if (((_a = this.qrCode) === null || _a === void 0 ? void 0 : _a.trim().length) > 0)
-                this.readyToClaim = true;
-        }
-        else {
-            if (((_b = this.invoice) === null || _b === void 0 ? void 0 : _b.trim().length) > 0 && ((_c = this.job) === null || _c === void 0 ? void 0 : _c.trim().length) > 0)
-                this.readyToClaim = true;
-        }
-    }
-    async onOpenChange(newOpenState) {
-        document.body.style.overflow = newOpenState ? 'hidden' : 'auto';
-        if (newOpenState) {
-            this.uploadProgress = 0;
-            this.selectedFile = null;
-            this.isDocumentError = false;
-        }
+    async close(forceClose = false) {
+        if (this.isLoading && !forceClose)
+            return;
+        this.isOpened = false;
+        document.body.style.overflow = 'auto';
+        await new Promise(r => setTimeout(r, 500));
+        this.resetState();
+        window.removeEventListener('keydown', this.closeModalListenerRef);
     }
     async setFileUploadProgression(uploadPercentage) {
         this.uploadProgress = uploadPercentage;
     }
+    // ====== End Component Logic
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-        const texts = this.locale;
-        const disableInput = !this.confirmServiceCancellation || !this.confirmUnInvoicedTBPVehicles || this.isLoading;
-        return (h(Host, { key: '68c9d9074bf07f9a2a881752c09a7ba2e64be92f' }, h("div", { key: '34a8a7642e036533a19c12c1c1f53e9d0318b032', dir: this.sharedLocales.direction, class: cn('dynamic-claim-processor min-w-[100dvw] h-[100dvh] flex flex-col justify-between p-[50px] box-border overflow-auto', (this === null || this === void 0 ? void 0 : this.isOpened) && 'active') }, h("svg", { key: '4627dac1932c7fc0b80de8048c1ad9e3e62109da', id: "dynamic-claim-processor-close-icon", onClick: this.closeModal, viewBox: "-0.5 0 25 25", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'ffb23a77a473a16cc7b206ffbe3f89ffbf922673', id: "SVGRepo_bgCarrier", "stroke-width": "0" }), h("g", { key: '2ba466a2fc2d6e1f642c2aac75d9886fdceec68b', id: "SVGRepo_tracerCarrier", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("g", { key: '3de8270e7c20b6da4bb7843075824ffddff114b1', id: "SVGRepo_iconCarrier" }, h("path", { key: '6eeb76fcce519e4f9dedca1fea8b4566a47495ff', d: "M3 21.32L21 3.32001", stroke: "#000000", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '261b6766db7a35b9fc0e2cded0426233388f2ce4', d: "M3 3.32001L21 21.32", stroke: "#000000", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("div", { key: 'a511c03d8adb06768cb326aa8913bcbf877f037a', class: "p-0 border border-[#dcdcdc] dynamic-claim-processor-info-box box-border" }, h("div", { key: 'c9e23b62e8bd27da57dc5d6ad11b726a3ac4bac7', class: "dynamic-claim-processor-info-box-header" }, h("strong", { key: '669782259fabb99a515f4b860a55971313ebef79', class: "dynamic-claim-header-vin" }, this === null || this === void 0 ? void 0 : this.internalVin)), h("div", { key: '92965a57eb7e8025077a881b4f9ff0377935522a', class: "dynamic-claim-processor-info-box-body" }, h("table", { key: '8a0bb605ef0c420369805954f95e4191ee2933b1', class: "border-separate" }, h("tr", { key: '5fea41900ad8de7ad0c39b012f5980156c08fc3c' }, h("th", { key: '78d467d8a54a4f836cd850485c2a095735388bf1' }, texts.serviceType), h("td", { key: 'ea27693cba300fa26653d25648eea367d10a5273' }, (_a = this === null || this === void 0 ? void 0 : this.internalItem) === null || _a === void 0 ? void 0 : _a.type), h("th", { key: '639450d7a2359a4de0cee8300b70f2a27c1b3a89' }, texts.name), h("td", { key: '3014be4d7deda07a7dd289e9a00a481524807e77' }, (_b = this === null || this === void 0 ? void 0 : this.internalItem) === null || _b === void 0 ? void 0 : _b.name)), h("tr", { key: '27ae532bab8417c10d724e5a64e64ef8894671b4' }, h("th", { key: 'b9bc6c432402cbf0473a7ab5e06cdf74d1f9c0d5' }, texts.activationDate), h("td", { key: '5b047e3eca4889bf571800d2b89c7bf69acf83c8' }, (_c = this === null || this === void 0 ? void 0 : this.internalItem) === null || _c === void 0 ? void 0 : _c.activatedAt), h("th", { key: '85d172b2be9e0a8faa4c45fbfb0702a5f3af72da' }, texts.expireDate), h("td", { key: '52d3b4453d1bd2cfce90bbf7a62475047ca44c7f' }, (_d = this === null || this === void 0 ? void 0 : this.internalItem) === null || _d === void 0 ? void 0 : _d.expiresAt)), h("tr", { key: '55eef0c232a7c2a5759fe0489878a732472ec5ab' }, h("th", { key: '1d8a9e465e381f70ee1c1e44c1188bc3a80f0441' }, texts.packageCode), h("td", { key: '90f7f04e74f5f3395c9aac095879e7887cead8ed' }, (_e = this === null || this === void 0 ? void 0 : this.internalItem) === null || _e === void 0 ? void 0 : _e.packageCode))))), h("div", { key: 'a69991bba649fd839a62bc441e7579b56cd74c43', style: { flex: '1', width: '100%', display: 'flex', flexDirection: 'column', justifyContent: 'space-evenly' } }, (this === null || this === void 0 ? void 0 : this.internalCanceledItem) && Array.isArray(this.internalCanceledItem) && !!this.internalCanceledItem.length && (h("div", { key: '1f2c413c6384a7297d84ca29d032ec73454f5ade', class: "admonition warning" }, h("p", { key: 'a94d82d025bb2427ea0e5d8b4b2fedd9962bdcd3', class: "admonition-title" }, texts.warning), h("div", { key: 'c2a69729ab2e054fc8e778f033301493432a96f9', style: { padding: '0 30px' } }, h("p", { key: 'f06f0232b58f2a4c0c476923551159ac3e85edee', class: "my-4" }, texts.skipServicesWarning), h("ul", { key: 'cd43b8e60c0f8e464f5852fc37dc961afcf78868', class: "dynamic-claim-processor-to-be-cancelled-list warning-ul my-4 list-disc" }, this.internalCanceledItem.map(({ name }) => (h("li", { id: name }, name)))), h("div", { key: 'a2b0e4a8e4692441f259039719d18045f78eda23', class: cn('cancel-confirmation-box transition duration-300', { 'pointer-events-none select-none opacity-50': this.isLoading }) }, h("label", { key: 'af3d3127cade63b49b91079a1e2554093b5c2ed5' }, h("input", { key: 'cd8a6cdc6d1b7fe959e458aac83778bf16887406', type: "checkbox", disabled: this.isLoading, class: "confirm-cancellation-input m-[3px] ml-1", onChange: () => {
-                this.confirmServiceCancellation = !this.confirmServiceCancellation;
-                setTimeout(() => {
-                    this.qrInput.focus();
-                }, 100);
-            } }), texts.confirmSkipServices))))), true && this.unInvoicedByBrokerName && (h("div", { key: '904e60f232c8c4040e15d0fff1285342024144ff', class: "admonition warning" }, h("p", { key: '2ffee3a33822761e703b4e3a2f9839659c6c9c73', class: "admonition-title" }, texts.warning), h("div", { key: '589a77167d0406d1c510241be7eebb9d9e1baa3f', style: { padding: '0 30px' } }, h("p", { key: 'a71561df3f5ff56946fad869ebd593523dbdd6a2', class: "my-4" }, texts.notInvoiced), h("div", { key: '87ae05d04059a1193101195684c59b1d7d5cfaf5' }, h("strong", { key: '88a95c3c07916d2295d50538111504f1d8afa34b' }, this.unInvoicedByBrokerName)), h("div", { key: 'f3192eb0857e63217fff60e7ef38006127fe4c19', class: cn('cancel-confirmation-box transition duration-300', { 'pointer-events-none select-none opacity-50': this.isLoading }) }, h("label", { key: '7b59ec73d0f4c3a36fb021be178ffafcf0cf723c' }, h("input", { key: '812dd79a73dfb1c9ffe5f156eac4802c68eb2a18', type: "checkbox", disabled: this.isLoading, class: "confirm-cancellation-input m-[3px] ml-1", onChange: () => {
-                this.confirmUnInvoicedTBPVehicles = !this.confirmUnInvoicedTBPVehicles;
-                setTimeout(() => {
-                    this.qrInput.focus();
-                }, 100);
-            } }), texts.confirmNotInvoiced))))), h("div", { key: 'a66d49b4f53bb1e590cff1578b0df52b3bf17b63', class: cn('dynamic-claim-processor-progress', disableInput && 'disabled') }, h("div", { key: '6c1ad07105b5885b0a53f5e32e40d2f734607821', id: "scan-invoice-step", class: cn('dynamic-claim-processor-progress-step', this.isLoading && 'processing') }, h("div", { key: '06fae64a5eb0fd06a4c3789aa37dd38e9a91460c', class: "relative size-[130px] m-auto mt-[15px] flex justify-center" }, h("div", { key: 'a5a67606641200e34460bb32825b410ee794ac55', class: "absolute scan-invoice-wrapper flex flex-col gap-[4px] justify-center items-center" }, h("svg", { key: '27b1a85ad8c72cf0bb88ea69c45b7ef04219b852', class: "size-[100px]", fill: "#3071a9", version: "1.1", id: "Layer_1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", stroke: "#ffffff" }, h("g", { key: '52350aa4858c1824cff211835fb0f836de5a29a3', id: "SVGRepo_bgCarrier", "stroke-width": "0" }), h("g", { key: '3d75a21222790b234bbad2441ac33b7c83a46549', id: "SVGRepo_tracerCarrier", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("g", { key: 'eb2ee054f685ac661c643c8ea3b0dddcaf6b77d9', id: "SVGRepo_iconCarrier" }, h("g", { key: '7534e0c97c9b24079aa9670d780ecdd21282bd53' }, h("g", { key: 'bcd7b85fb38b015b78fea769c0b0c5f715f2a8b2' }, h("path", { key: '97b7f3ae9a72ec35a6cf8ff683c6734fda4c410e', d: "M354.338,34.205h-61.71c-3.354-9.93-12.752-17.102-23.8-17.102h-17.547C243.359,6.451,230.813,0,217.521,0 s-25.839,6.451-33.76,17.102h-17.547c-11.048,0-20.446,7.172-23.8,17.102H80.701c-18.566,0-33.67,15.105-33.67,33.67v359.148 c0,18.566,15.105,33.67,33.67,33.67h171.023c4.427,0,8.017-3.589,8.017-8.017c0-4.427-3.589-8.017-8.017-8.017H80.701 c-9.725,0-17.637-7.912-17.637-17.637V67.875c0-9.725,7.912-17.637,17.637-17.637h60.394v26.188c0,4.427,3.589,8.017,8.017,8.017 H285.93c4.427,0,8.017-3.589,8.017-8.017V50.238h60.391c9.725,0,17.637,7.912,17.637,17.637v230.881 c0,4.427,3.589,8.017,8.017,8.017c4.427,0,8.017-3.589,8.017-8.017V67.875C388.008,49.309,372.904,34.205,354.338,34.205z M277.914,68.409H157.129V42.252c0-0.011,0.001-0.02,0.001-0.031c0-0.005-0.001-0.011-0.001-0.015 c0.009-5.004,4.08-9.071,9.085-9.071h21.846c2.854,0,5.493-1.517,6.929-3.985c4.781-8.213,13.204-13.117,22.532-13.117 s17.751,4.904,22.532,13.117c1.435,2.467,4.075,3.985,6.929,3.985h21.846c4.999,0,9.067,4.059,9.085,9.055 c0,0.011-0.001,0.02-0.001,0.031c0,0.021,0.003,0.041,0.003,0.062V68.409z" }))), h("g", { key: 'efb74c8efdecb67d81605303cfb8c6bcbec6dbf3' }, h("g", { key: '066bd75b457609225923dd633b414b3e91402fa9' }, h("path", { key: 'd760e3598cbe2128b0775ead8d8e688ffc9314a2', d: "M251.722,410.455H97.269V84.443h17.64c4.427,0,8.017-3.589,8.017-8.017s-3.589-8.017-8.017-8.017H89.253 c-4.427,0-8.017,3.589-8.017,8.017v342.046c0,4.427,3.589,8.017,8.017,8.017h162.47c4.427,0,8.017-3.589,8.017-8.017 C259.739,414.044,256.15,410.455,251.722,410.455z" }))), h("g", { key: 'aab0fa7508721b68fc2c7b3b68e715895b3458cf' }, h("g", { key: '4a43204e700d1bc841e5baef5e2dc595ec20caed' }, h("path", { key: 'c33532bf58411ef44949ef9d4564ed6c8003e3ab', d: "M345.787,68.409h-25.653c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h17.637v214.311 c0,4.427,3.589,8.017,8.017,8.017s8.017-3.589,8.017-8.017V76.426C353.804,71.999,350.214,68.409,345.787,68.409z" }))), h("g", { key: 'dd3071605b5debe1a79bd2ae5f40bc48fdd7e9be' }, h("g", { key: '3ff3474f54eb29f9110ad5065685d3ba2ef4b4fe' }, h("path", { key: '6dec15e24b60605909198eccb7b57247dcb2a834', d: "M371.44,324.944c-51.572,0-93.528,41.956-93.528,93.528S319.869,512,371.44,512s93.528-41.956,93.528-93.528 S423.012,324.944,371.44,324.944z M371.44,495.967c-42.731,0-77.495-34.764-77.495-77.495s34.764-77.495,77.495-77.495 s77.495,34.764,77.495,77.495S414.172,495.967,371.44,495.967z" }))), h("g", { key: '2ad2cc2657d29f0b8a96d7da23cccf90c69fd6fc' }, h("g", { key: 'f276ca6db90f01a7d852729dbaaed1778e5760c4' }, h("path", { key: '5b9d5ef408dd896886f6d9ca036226d659abe3d5', d: "M217.607,34.205h-0.086c-4.427,0-7.974,3.589-7.974,8.017c0,4.427,3.631,8.017,8.059,8.017 c4.427,0,8.017-3.589,8.017-8.017C225.624,37.794,222.035,34.205,217.607,34.205z" }))), h("g", { key: '054e5fc9d1cc0583b98902aeef39cda66b084f32' }, h("g", { key: 'bcfe15c6bf1d3042d9c6372d8e9ba54c21ecf76e' }, h("path", { key: 'aa8792e2aa38be93e9ae2e30cc81729c23a45da2', d: "M419.865,387.15c-3.13-3.131-8.207-3.131-11.337,0l-54.19,54.19l-28.536-28.536c-3.131-3.131-8.207-3.131-11.337,0 c-3.131,3.131-3.131,8.207,0,11.337l34.205,34.205c1.565,1.565,3.617,2.348,5.668,2.348s4.103-0.782,5.668-2.348l59.858-59.858 C422.995,395.356,422.995,390.28,419.865,387.15z" }))), h("g", { key: 'd68d6c58038ea3052bfac3d82338929e70aa3097' }, h("g", { key: '08af492daf3daaa098c0f72e2da940fa44dbdd9c' }, h("path", { key: '40367fae5ff977de6810d1c9e678012d709d1551', d: "M182.781,177.309v-32.338c11.295,1.934,18.171,7.688,18.171,11.889c0,4.427,3.589,8.017,8.017,8.017 s8.017-3.589,8.017-8.017c0-14.171-14.492-25.621-34.205-28.092v-1.036c0-4.427-3.589-8.017-8.017-8.017s-8.017,3.589-8.017,8.017 v1.036c-19.713,2.47-34.205,13.92-34.205,28.092c0,20.074,18.829,27.788,34.205,32.461v32.338 c-11.295-1.934-18.171-7.688-18.171-11.889c0-4.427-3.589-8.017-8.017-8.017s-8.017,3.589-8.017,8.017 c0,14.171,14.492,25.621,34.205,28.092v1.036c0,4.427,3.589,8.017,8.017,8.017s8.017-3.589,8.017-8.017v-1.036 c19.713-2.47,34.205-13.92,34.205-28.092C216.985,189.697,198.157,181.982,182.781,177.309z M166.747,172.411 c-13.524-4.713-18.171-8.963-18.171-15.551c0-2.535,2.236-5.335,6.134-7.68c3.294-1.982,7.473-3.415,12.037-4.198V172.411z M194.818,217.45c-3.294,1.982-7.473,3.415-12.037,4.198v-27.429c13.524,4.713,18.171,8.963,18.171,15.551 C200.952,212.306,198.716,215.105,194.818,217.45z" }))), h("g", { key: 'cf8927f3294bbe3c3dee974eb6eedd35a64af7f9' }, h("g", { key: '1d6da1c5f329b1d307be9b0d8b1eece5ab224820' }, h("path", { key: 'd073e7fd4d94c5498bffce70c1a0ed270caa82a2', d: "M294.48,136.818h-42.756c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h42.756 c4.427,0,8.017-3.589,8.017-8.017S298.908,136.818,294.48,136.818z" }))), h("g", { key: '8e11a207b42e1b1f428371430ad3227982d7fc27' }, h("g", { key: 'ea3779641ca29f16eab99e4dceaddfa749089431' }, h("path", { key: 'e690ddeb9dd1ddb3e7c68a48e3224e31a47f1194', d: "M277.378,171.023h-25.653c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h25.653 c4.427,0,8.017-3.589,8.017-8.017S281.805,171.023,277.378,171.023z" }))), h("g", { key: '9f534377d19c2e792d3b1e1832dc5662b1deeb8b' }, h("g", { key: 'ce70ca0518ee32b505924c327a939ec674650ddc' }, h("path", { key: 'dedb50496128b75b2db69f27adc74bc8c25ed502', d: "M294.48,205.228h-42.756c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h42.756 c4.427,0,8.017-3.589,8.017-8.017S298.908,205.228,294.48,205.228z" }))), h("g", { key: 'd52a212dbd5b5655397ebb9419e24270571785a1' }, h("g", { key: '22fec222015c5197ea5889087b9daac943a07091' }, h("path", { key: '0f113b43716fb9dbc8d2d7a02c931552e3e237aa', d: "M157.662,282.188H140.56c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h17.102 c4.427,0,8.017-3.589,8.017-8.017S162.089,282.188,157.662,282.188z" }))), h("g", { key: '98080cc467d4ff86edd1ee502d69d7c29890f59f' }, h("g", { key: 'fcf6ec7ed882cfae55f4edc285aebe2e187446cc' }, h("path", { key: '867ae2e0e6de0390b48165d5bbff27d64b70d169', d: "M157.662,350.597H140.56c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h17.102 c4.427,0,8.017-3.589,8.017-8.017S162.089,350.597,157.662,350.597z" }))), h("g", { key: 'fb9a41c4496e15f642d0c499b1df54bcd2b223f4' }, h("g", { key: '9b2ca7a88af51a951a63c38c3e8a91b804c53bc8' }, h("path", { key: '1d991c71467a7fb5cdd4016cdabbc740edc9623e', d: "M157.662,316.393H140.56c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h17.102 c4.427,0,8.017-3.589,8.017-8.017S162.089,316.393,157.662,316.393z" }))), h("g", { key: '0784c45256bfdd109af8981e68a62b64d5f4bb2d' }, h("g", { key: 'a0cf56ced4d7e2b42722418575110c599ac9e783' }, h("path", { key: '5bd017b9528946e06a3f130e42b1c9a1ceb38e4d', d: "M294.48,282.188H191.866c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017H294.48 c4.427,0,8.017-3.589,8.017-8.017S298.908,282.188,294.48,282.188z" }))), h("g", { key: 'f6e378dab20b36c0faf85aabf934c7a1372611bf' }, h("g", { key: '05bfb5e03d3267d0dece25b3457a8902eae790c3' }, h("path", { key: '6b7413cf3261cbb3cb8c38b9dd317217ea6efeee', d: "M268.827,350.597h-76.96c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017h76.96 c4.427,0,8.017-3.589,8.017-8.017S273.254,350.597,268.827,350.597z" }))), h("g", { key: 'c0ca6d6f8a4f31f7602a7e038cc39e9d63f8100a' }, h("g", { key: '3527da0fed57f1846e9f91f07e6fc9e3c0381b76' }, h("path", { key: 'bf9cb5feedc3578c9681a2950ae89c8dc586b83a', d: "M294.48,316.393H191.866c-4.427,0-8.017,3.589-8.017,8.017s3.589,8.017,8.017,8.017H294.48 c4.427,0,8.017-3.589,8.017-8.017S298.908,316.393,294.48,316.393z" }))))), h("div", { key: 'd31bd96b6c620ccf7f9392da180d8e5119a99f55' }, this.claimViaBarcodeScanner ? texts.scanTheVoucher : texts.enterServiceInfo)), h("div", { key: '54cab888dd7662695bd60818875717a0e4806dc5', class: "loading-wrapper flex flex-col gap-[4px] items-center justify-center absolute" }, h("div", { key: 'be869e51d9b9ce421badf9f33f9e06f7d6dc41d1', class: cn('lds-ripple relative size-[100px] flex items-center justify-center', this.isLoading && 'active') }, h("div", { key: 'c335eea4689184ef09e07789205d245511a7c3de' }), h("div", { key: 'e8aa257e10d9bdae87d1604a4051e3741d94ee18' })), ((_f = this.item) === null || _f === void 0 ? void 0 : _f.showDocumentUploader) && this.selectedFile ? (h("div", { class: "relative border-[#3071a9] w-[300px] border-[2px] font-semibold h-[30px] overflow-hidden rounded-full flex items-center justify-center" }, texts.processing, " ", `${this.uploadProgress}%`, h("div", { style: {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
+        const isQRScannerForm = ((_a = this.item) === null || _a === void 0 ? void 0 : _a.claimingMethodEnum) === 'ClaimByScanningQRCode';
+        const disableInputs = !this.getIsFormConfirmed() || this.isLoading;
+        const isFormValid = this.getIsFormValid();
+        return (h(Host, { key: '68bf42046badf6483d96a3d0d246997f78afc837' }, h(ImageViewer, { key: '1c3b053514955c9926d0dff574515d9c91721ba3', style: { 'z-index': '99999999' }, expandedImage: this.expandedImage, imageStyle: { 'z-index': '999999999' }, closeImageViewer: () => closeImageViewer.bind(this)() }), h("div", { key: '5a3e4dd1652450520791a871ad0afadd0d5a1f2c', dir: this.locale.sharedLocales.direction, class: cn('min-w-[100dvw] pointer-events-none h-[100dvh] bg-white fixed top-0 left-0 z-[999] flex flex-col transition duration-500 scale-[110%] opacity-0 justify-between p-[50px] box-border overflow-auto', {
+                'opacity-1 scale-100 pointer-events-auto': this.isOpened,
+            }) }, h("button", { key: 'd11ef680cbf3e0eed7c18257547bc6584188a8d0', disabled: this.isLoading, onClick: this.close.bind(this), class: "disabled:opacity-50 transition absolute right-[50px] duration-500 rounded-full enabled:hover:bg-red-200 enabled:hover:text-red-400 text-black enabled:hover:scale-[150%] enabled:hover:rotate-[135deg] size-[35px] rotate-[45deg]" }, h(AddIcon, { key: 'bb82189a466165e3679366500ecee1cbc6eea49b', class: "stroke-[1.5px]" })), h("div", { key: '376be70e1bf25a40ba04529dc8e7c094610dc179', class: "flex flex-col h-full gap-[32px] justify-between" }, h("div", { key: 'adfda45afa90a773ba53e5c09d4a2bc38c992974', class: "flex mt-[50px] flex-col shrink-0 gap-[20px]" }, h("div", { key: 'bdc0e739e70f362f3b186df490b28a271d19eb9b', class: "border overflow-hidden rounded-[6px] border-[#dcdcdc] box-border" }, h("div", { key: '0e8ec265b6364ec1e76b162e258ac84fceddd4bc', class: "relative text-[16px] h-[50px] font-semibold flex items-center justify-center bg-[#f6f6f6]" }, this.vin, !!((_b = this.item) === null || _b === void 0 ? void 0 : _b.printUrl) && (h("button", { key: 'cc5ebfbb4fde8a4b9858a7804beeac53eee65c27', class: "outline-button absolute end-[16px]", onClick: () => window.open(this.item.printUrl, '_blank').focus() }, h(PrintIcon, { key: 'fdac2505adaba1430443d33050d0fc7455cf1d93', class: "size-[30px] duration-200" }), h("span", { key: '32f48945b8912f4b909f7826ce9f6c098f7a4176' }, this.locale.print)))), h("div", { key: 'f2b0ce9cd68dda03b202dcba31acd54bf9dfc2fb', class: "overflow-hidden flex p-[22px] [&_div]:min-w-[200px] gap-[32px] flex-wrap justify-center" }, h(MaterialCard, { key: 'b8ed2882ccc70f95d5dd141d64efc8c20a34922c', title: this.locale.serviceType }, (_c = this.item) === null || _c === void 0 ? void 0 : _c.type), h(MaterialCard, { key: 'f0c9bd861be008a94dfb9de30cced23812459307', title: this.locale.name }, (_d = this.item) === null || _d === void 0 ? void 0 : _d.name), h(MaterialCard, { key: '46fdf7c4d4873c8473b48097d59b5bec5bed8ec9', title: this.locale.activationDate }, (_e = this.item) === null || _e === void 0 ? void 0 : _e.activatedAt), h(MaterialCard, { key: 'f43414b58f77fd1861ef542ea398fef88cd16735', title: this.locale.expireDate }, (_f = this.item) === null || _f === void 0 ? void 0 : _f.expiresAt), h(MaterialCard, { key: '0eab1ed8fb785e3b80a51f174e0849a11490544c', title: this.locale.packageCode }, (_g = this.item) === null || _g === void 0 ? void 0 : _g.packageCode))), Array.isArray((_h = this.item) === null || _h === void 0 ? void 0 : _h.warnings) &&
+            this.item.warnings.map(warning => (h("div", { key: warning.key, class: "border overflow-hidden rounded-[6px] border-[#ff9100] box-border" }, h("div", { class: "text-[16px] px-[22px] h-[50px] font-semibold flex items-center gap-[8px] bg-[#ff91001a]" }, h(AlertIcon, { class: "size-[25px] text-[#ff9100]" }), " ", warning.title), h("div", { class: "p-[16px]" }, h("div", { class: "text-[16px] flex-col items-center md:flex-row flex gap-[16px]" }, h("div", { class: "flex-1", innerHTML: warning.bodyContent }), (warning === null || warning === void 0 ? void 0 : warning.imageUrl) && (h("button", { onClick: ({ target }) => openImageViewer.bind(this)(target, warning === null || warning === void 0 ? void 0 : warning.imageUrl), class: "shrink-0 relative ring-0 outline-none w-fit mx-auto [&_img]:hover:shadow-lg [&_div]:hover:!opacity-100 cursor-pointer" }, h("div", { class: "absolute flex-col justify-center gap-[4px] size-full flex items-center pointer-events-none hover:opacity-100 rounded-lg opacity-0 bg-black/40 transition-all duration-300" }, h("img", { src: Eye }), h("span", { class: "text-white" }, this.locale.expand)), h("img", { class: "w-auto h-auto max-w-[200px] max-h-[200px] cursor-pointer shadow-sm rounded-lg transition-all duration-300", src: warning === null || warning === void 0 ? void 0 : warning.imageUrl })))), (warning === null || warning === void 0 ? void 0 : warning.confirmationText) && (h("label", { class: cn('select-none text-[16px] flex font-semibold group items-center px-[16px] gap-[10px] mt-[20px] h-[36px] transition duration-300 rounded-[6px] cursor-pointer text-[#663c00] bg-[#ff91001a] border border-[#ffd28f]', {
+                    'hover:bg-[#fff8e1]': !this.isLoading,
+                    'opacity-50 pointer-events-none': this.isLoading,
+                }) }, h("input", { type: "checkbox", class: "peer sr-only", disabled: this.isLoading, checked: !!this.confirmationStates[warning.key], onChange: this.onConfirmCheckboxChange(warning.key) }), h("div", { class: "size-[20px] rounded border border-[#ffb74d] transition duration-300 text-transparent peer-checked:text-white peer-checked:bg-[#ff9100] peer-checked:border-[#ff9100] flex items-center justify-center" }, h(CheckIcon, { class: "size-[18px]" })), warning === null || warning === void 0 ? void 0 :
+                warning.confirmationText))))))), h("div", { key: '720375915cd8759c3876c6e29eb891d7a95db7b6', class: cn('flex flex-col shrink-0 my-auto gap-[20px] h-fit p-[50px] border-[2px] border-[#3071a9] transition duration-500 items-center rounded-[8px] shadow-lg bg-[#f4f4f4]', {
+                'border-[#f4f4f4]': this.isLoading,
+            }) }, h("div", { key: 'df0317422a3bf7a4f4959051ca0b6775e6f97195', class: "relative w-[200px] h-[140px]" }, h("div", { key: 'f2fffeb225253711875ae9dd18e5dc2373cf4edd', class: cn('absolute size-full transition-all duration-500 flex flex-col items-center gap-[12px] left-0 top-0', { 'left-full opacity-0': this.isLoading }) }, h(FormSubmitSVG, { key: 'e62acf3c9105801311b513f811c519d4d9ec6d7e', class: "size-[100px] fill-[#3071a9] text-[#3071a9]" }), h("div", { key: '83b70c98685c2e0a61276aa9d49c53b317ae2fa4', class: "text-[16px] text-[#3071a9] font-semibold" }, isQRScannerForm ? this.locale.scanTheVoucher : this.locale.enterServiceInfo)), h("div", { key: '821c19a531e2fc90eb844055ffbea8aeddd5d9c6', class: cn('absolute size-full opacity-0 transition-all duration-500 -left-full flex flex-col gap-[12px] items-center', { 'left-0 opacity-100': this.isLoading }) }, h("div", { key: '346408e4c016fbfc03ab9ed174c90f39c8fc3b1a', class: cn('relative size-[100px] flex items-center justify-center') }, h("div", { key: 'c18f5bd47ade67c034a3f94eb0e6097dd96d16d7', class: "lds-ripple" }), h("div", { key: '1a57578950e817dea2ba60ca64bd0b4b64d77cdf', class: "lds-ripple" })), ((_j = this.item) === null || _j === void 0 ? void 0 : _j.showDocumentUploader) && !!this.inputs['documents'].length ? (h("div", { class: "relative border-[#3071a9] text-[#3071a9] text-[16px] w-[300px] border-[2px] font-semibold h-[30px] overflow-hidden rounded-full flex items-center justify-center" }, h("span", { class: "relative z-20" }, this.locale.processing, " ", `${this.uploadProgress}%`), h("div", { style: {
                 width: `${this.uploadProgress}%`,
                 background: `linear-gradient(to right, rgba(219, 234, 254, ${Math.min(0.1 + this.uploadProgress / 100, 1)}), rgba(191, 219, 254, ${Math.min(0.15 + this.uploadProgress / 100, 1)}), rgba(147, 197, 253, ${Math.min(0.2 + this.uploadProgress / 100, 1)}))`,
-            }, class: "absolute left-0 top-0 h-full -z-10 transition-[width] duration-700 ease-out" }))) : (h("div", { class: cn('lds-ripple-loading', this.isLoading && 'active') }, texts.processing)))), h("div", { key: '4f47ef68bfcc7a2f32de7b145effdba9e5384414', class: cn('transition-opacity duration-300 ', { 'opacity-50': this.isLoading }) }, this.claimViaBarcodeScanner && (h("div", { key: '9ebe76e081b30f0da7c9013a1dd4084091951722', class: "flex flex-col mt-[50px] px-[75px] gap-[16px]" }, ((_g = this.item) === null || _g === void 0 ? void 0 : _g.showDocumentUploader) && (h("div", { key: '000d1a2f04c450bdc20f830c6993687f045c7995', class: "flex mb-[12px] flex-col" }, h("input", { key: 'bc24f703d27499f55411660e5245f1d6c5d09634', class: "document-uploader", disabled: this.isLoading, type: "file", accept: "image/*,application/pdf", hidden: true }), h("div", { key: '0a2845bc6c47ee45b036f703a066ceaffdf60c11', class: cn('document-button overflow-hidden flex items-center w-fit mx-auto cursor-pointer gap-[16px] ps-[8px] h-[32px] transition duration-300 text-white bg-[#275e8f] active:bg-[#223f57] hover:bg-[#3071a9] rounded-[5px]', { 'pointer-events-none bg-[#d5d5d5] cursor-default': disableInput }) }, h("div", { key: '02ac6449f4f7c6e19bfffe6056c6c89a9799145f', title: ((_h = this.selectedFile) === null || _h === void 0 ? void 0 : _h.name) || texts.document, class: "max-w-[200px] truncate whitespace-nowrap overflow-hidden text-ellipsis" }, ((_j = this.selectedFile) === null || _j === void 0 ? void 0 : _j.name) || texts.document, ((_k = this === null || this === void 0 ? void 0 : this.item) === null || _k === void 0 ? void 0 : _k.documentUploaderIsRequired) && !this.selectedFile && h("span", { key: '43b0c4f31ff30123cf6698492d14755e1b2c1491', class: cn('ps-[4px] text-red-500', { 'text-white': disableInput }) }, "*")), h("button", { key: '857001af21a4e425126b03412fed5aebfc8158f3', onClick: this.clearFile, class: cn('overflow-hidden transition duration-300 hover:bg-red-600 relative cursor-pointer flex items-center justify-center size-[32px]', {
-                'pointer-events-none cursor-default': !this.selectedFile,
-            }) }, h("svg", { key: 'd96a3944a833276f977e92cf2e4ebd0eadc93dcd', fill: "none", "stroke-width": "2", viewBox: "0 0 24 24", stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round", xmlns: "http://www.w3.org/2000/svg", class: cn('size-[24px] absolute transition duration-500', { '-translate-y-[32px]': !!this.selectedFile }) }, h("path", { key: '1a6e2b06a86ccfc10c0f40e77e932931ff47497c', d: "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" })), h("svg", { key: '0e3f6fca1de9473cc9e14e01f987327d30283cec', fill: "none", "stroke-width": "2", viewBox: "0 0 24 24", stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round", xmlns: "http://www.w3.org/2000/svg", class: cn('size-[24px] absolute transition translate-y-[32px] duration-500', { 'translate-y-0': !!this.selectedFile }) }, h("path", { key: 'f824d624de4d0555558bf007eaac4b549d3d12e2', d: "M18 6 6 18" }), h("path", { key: 'fe4a57efa8ca6dc6a7ccec24d7a0cf53909556cf', d: "m6 6 12 12" })))), h("flexible-container", { key: 'd175450892190f55da5d065e84c700f528dfe698', isOpened: this.isDocumentError }, h("div", { key: 'fba9c58b27ec0bca5eaaffc0037f159dfddd20ec', class: "text-red-700 w-fit mx-auto pt-[8px]" }, this.documentError === 'documentLimitError'
-            ? texts.documentLimitError + `${this.maximumDocumentFileSizeInMb}Mb`
-            : texts.documentRequiredError || this.sharedLocales.errors.wildCard)))), h("input", { key: '785e3068bffe0ea93bf402cefdac4264878a60fc', id: "qr-input", dir: "ltr", class: "dynamic-redeem-input", spellcheck: "false", onInput: e => {
-                this.qrCode = e.target.value;
-                this.updateReadyToClaim();
-            }, onKeyDown: this.inputKeyDown, onBlur: () => {
-                var _a;
-                (_a = this.qrInput) === null || _a === void 0 ? void 0 : _a.focus();
-            }, autocomplete: "off", disabled: disableInput, placeholder: texts.qrCode, autofocus: true, style: { marginTop: '20px', padding: '10px 0px', fontSize: '16px' } }))), !this.claimViaBarcodeScanner && (h("div", { key: 'e85757dbdfe4b1d02789ea2b5c46116f4567dfb9' }, h("div", { key: '91462a93e3bfaeb62f2712768e5dc98d69317061', style: { display: 'flex', flexDirection: 'row', gap: '50px', padding: '0 75px' } }, h("input", { key: 'f8ded36b8a1806639c96af1f3b8e36a3d65e23d8', id: "invoice-input", dir: "ltr", class: "dynamic-redeem-input", spellcheck: "false", onInput: e => {
-                this.invoice = e.target.value;
-                this.updateReadyToClaim();
-            }, onKeyDown: this.inputKeyDown, autocomplete: "off", disabled: disableInput, placeholder: texts.invoice, autofocus: true, style: { marginTop: '20px', padding: '10px 0px', fontSize: '16px' } }), h("input", { key: '5a01b31453e8327e4311f83371e9d7a390148b30', id: "job-input", dir: "ltr", class: "dynamic-redeem-input", spellcheck: "false", onInput: e => {
-                this.job = e.target.value;
-                this.updateReadyToClaim();
-            }, onKeyDown: this.inputKeyDown, autocomplete: "off", disabled: disableInput, placeholder: texts.jobNumber, style: { marginTop: '20px', padding: '10px 0px', fontSize: '16px' } })), h("div", { key: 'a7624ccbd379c9edb947633424bca66dcbd80328', class: "mt-[55px]" }, ((_l = this.item) === null || _l === void 0 ? void 0 : _l.showDocumentUploader) && (h("div", { key: '9c9c03064d48b36d72db1047dcd1e9c2a6067829', class: "flex mb-[12px] flex-col" }, h("input", { key: '395549c0430ba0d15a77ad8ed9217e64d41db35d', class: "document-uploader", disabled: this.isLoading, type: "file", accept: "image/*,application/pdf", hidden: true }), h("div", { key: '5822f068ed2fa2999f3899ad00217ca7f12194a3', class: cn('document-button overflow-hidden flex items-center w-fit mx-auto cursor-pointer gap-[16px] ps-[8px] h-[32px] transition duration-300 text-white bg-[#275e8f] active:bg-[#223f57] hover:bg-[#3071a9] rounded-[5px]', { 'pointer-events-none bg-[#d5d5d5] cursor-default': disableInput }) }, h("div", { key: '2cdddf5dad95185aa2476df8cfefc2012f6f03fc', title: ((_m = this.selectedFile) === null || _m === void 0 ? void 0 : _m.name) || texts.document, class: "max-w-[200px] truncate whitespace-nowrap overflow-hidden text-ellipsis" }, ((_o = this.selectedFile) === null || _o === void 0 ? void 0 : _o.name) || texts.document, ((_p = this === null || this === void 0 ? void 0 : this.item) === null || _p === void 0 ? void 0 : _p.documentUploaderIsRequired) && !this.selectedFile && h("span", { key: 'b7474a8e0c0f3bc05aedd8a6df88e103efaf57f1', class: cn('ps-[4px] text-red-500', { 'text-white': disableInput }) }, "*")), h("button", { key: '9097a209bbba8ac1cba8bfe6f45ca316af97124d', onClick: this.clearFile, class: cn('overflow-hidden transition duration-300 hover:bg-red-600 relative cursor-pointer flex items-center justify-center size-[32px]', {
-                'pointer-events-none cursor-default': !this.selectedFile,
-            }) }, h("svg", { key: 'acf7be70e4e2c2eedbf0cfcbad84870e581e3293', fill: "none", "stroke-width": "2", viewBox: "0 0 24 24", stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round", xmlns: "http://www.w3.org/2000/svg", class: cn('size-[24px] absolute transition duration-500', { '-translate-y-[32px]': !!this.selectedFile }) }, h("path", { key: '58e0fd59dbb2be4055248d852c63c65884c4dce6', d: "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" })), h("svg", { key: 'b6d2d4838093fd109b7c55f972e7ad5aaf308cf9', fill: "none", "stroke-width": "2", viewBox: "0 0 24 24", stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round", xmlns: "http://www.w3.org/2000/svg", class: cn('size-[24px] absolute transition translate-y-[32px] duration-500', { 'translate-y-0': !!this.selectedFile }) }, h("path", { key: '03144a7be6cdcd9683b65241094e1750a71b8d66', d: "M18 6 6 18" }), h("path", { key: '5096ab5d1f47c757da5dc820635c03879c4fe7ca', d: "m6 6 12 12" })))), h("flexible-container", { key: '050348034f7143a7fc2ed617d5bda8a93e1f5c6c', isOpened: this.isDocumentError }, h("div", { key: 'f80d151c8cfa856964bf38f613cfc12a171ca101', class: "text-red-700 w-fit mx-auto pt-[8px]" }, this.documentError === 'documentLimitError'
-            ? texts.documentLimitError + `${this.maximumDocumentFileSizeInMb}Mb`
-            : texts.documentRequiredError || this.sharedLocales.errors.wildCard)))), h("button", { key: 'b8714b8aa98e55a5a2fabd6ef1edb14e9fba8be0', onClick: () => {
-                this.inputKeyDown(null);
-            }, class: cn('claim-button', 'dynamic-claim-button', (!(this === null || this === void 0 ? void 0 : this.readyToClaim) || disableInput) && 'disabled') }, h("svg", { key: '5f901fcf4a0c64c900f7dcd255feb080f8fe665b', width: "30px", height: "30px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '8cf3f4d55bb5873ab7a6a87f720aae238da8b04c', "stroke-width": "0" }), h("g", { key: 'ecc6484402aacc974b80a5fcc2a9aeb595af90f0', "stroke-linecap": "round", "stroke-linejoin": "round" }), h("g", { key: 'b658cee1493b7dc7c8b5bf507eaf1f61865aa98f' }, h("circle", { key: '5dc79f07d82ef4a4970aa5d5284bc26e41d7b55b', cx: "12", cy: "12", r: "8", "fill-opacity": "0.24" }), h("path", { key: 'b3e6054499769d491397a54a53bc214f5e40d76a', 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", { key: '50eb43fc0b8fa9b18aecbcf200ee1e0b456d3709' }, texts.claim))))))))))));
+            }, class: "absolute left-0 z-10 top-0 h-full transition-[width] duration-700 ease-out" }))) : (h("div", { class: "text-[16px] text-[#3071a9] font-semibold" }, this.locale.processing)))), ((_k = this.item) === null || _k === void 0 ? void 0 : _k.showDocumentUploader) && (h("div", { key: '3ce09c1b7eeb5d06f7d4f62f2e13a99e9e2a2832', class: "flex mb-[16px] w-full flex-col" }, h("input", { key: '4711e3ad8c4c844fdc4aeea2b822afb6c959f35e', hidden: true, type: "file", class: "document-uploader", disabled: this.isLoading, accept: "image/*,application/pdf", onChange: this.onFileUploaderChange, multiple: this.uploadMultipleDocuments, "data-max-size": this.maximumDocumentFileSizeInMb * 1024 * 1024 }), h("div", { key: 'c6cfa5ff09f3b9a7fa850778cc1a8406b1470ffb', onClick: this.onDocumentButtonClicked, class: cn('overflow-hidden flex items-center w-fit mx-auto cursor-pointer gap-[16px] ps-[8px] h-[32px] transition duration-300 text-white bg-[#275e8f] active:bg-[#223f57] hover:bg-[#3071a9] rounded-[5px]', { 'pointer-events-none bg-[#d5d5d5] cursor-default': disableInputs }) }, h("div", { key: '762740b15f1a1969a00f3c731655b2b1e19664fa', title: this.uploadMultipleDocuments ? this.locale.uploadMultipleDocument : this.locale.uploadSingleDocument, class: "max-w-[200px] truncate whitespace-nowrap overflow-hidden text-ellipsis" }, this.uploadMultipleDocuments ? this.locale.uploadMultipleDocument : this.locale.uploadSingleDocument, ((_l = this === null || this === void 0 ? void 0 : this.item) === null || _l === void 0 ? void 0 : _l.documentUploaderIsRequired) && !((_m = this.inputs) === null || _m === void 0 ? void 0 : _m.documents.length) && (h("span", { key: '4d94c48440cf1d230da3b913d2f6b580ec288c61', class: cn('ps-[4px] text-red-500', { 'text-white': disableInputs }) }, "*"))), h("button", { key: '6f243a97f7cf5d451baf94c326f55d405be24535', onClick: this.clearFile, class: cn('overflow-hidden transition duration-300 hover:bg-red-600 relative cursor-pointer flex items-center justify-center size-[32px]', {
+                'pointer-events-none cursor-default': !((_o = this.inputs) === null || _o === void 0 ? void 0 : _o.documents.length),
+            }) }, h(AttachIcon, { key: '69ba9c0fce73213affef7c226a27c8fab4e168f1', class: cn('size-[24px] absolute transition duration-500', { '-translate-y-[32px]': !!((_p = this.inputs) === null || _p === void 0 ? void 0 : _p.documents.length) }) }), h(AddIcon, { key: '3fb8beb241965d6c7978aedb8162c05e23a0fbbc', class: cn('size-[24px] rotate-[45deg] absolute transition translate-y-[32px] duration-500', { 'translate-y-0': !!((_q = this.inputs) === null || _q === void 0 ? void 0 : _q.documents.length) }) }))), h("flexible-container", { key: '35a261615caa5d8b1298aedd18041cd1938d78e2', isOpened: !!((_s = (_r = this.errors) === null || _r === void 0 ? void 0 : _r.documents) === null || _s === void 0 ? void 0 : _s.show) }, h("div", { key: 'a550ee88124dd9dac42676537043001dc8eebf09', class: "text-red-700 w-fit mx-auto pt-[8px]" }, ((_u = (_t = this.errors) === null || _t === void 0 ? void 0 : _t.documents) === null || _u === void 0 ? void 0 : _u.text) === 'documentLimitError'
+            ? this.locale.documentLimitError + `${this.maximumDocumentFileSizeInMb}Mb`
+            : this.locale.documentRequiredError || this.locale.sharedLocales.errors.wildCard)), h("flexible-container", { key: 'eea0f00692335fe33a28d249f74702072ffbdfd3', isOpened: !!((_w = (_v = this.inputs) === null || _v === void 0 ? void 0 : _v.documents) === null || _w === void 0 ? void 0 : _w.length), containerClasses: "" }, h("div", { key: 'eee5774648c156c8e7f71803b861fa64bf169346', class: "flex w-full pt-[16px] flex-wrap justify-center gap-[16px]" }, (_y = (_x = this.inputs) === null || _x === void 0 ? void 0 : _x.documents) === null || _y === void 0 ? void 0 : _y.map((doc, idx) => {
+            var _a;
+            return (h("div", { class: cn('flex relative overflow-hidden max-w-[400px] items-center justify-between gap-[20px] bg-slate-400 rounded-[4px] text-white text-[14px]', {
+                    'pointer-events-none bg-[#d5d5d5] cursor-default': disableInputs,
+                }) }, h("span", { title: doc.name, class: "truncate ps-[16px] py-[8px]" }, doc.name), h("button", { disabled: disableInputs, onClick: () => this.clearFile(idx), class: cn('overflow-hidden transition duration-300 hover:bg-red-600 relative cursor-pointer flex items-center justify-center size-[32px]', {
+                    'pointer-events-none cursor-default': !((_a = this.inputs) === null || _a === void 0 ? void 0 : _a.documents.length),
+                }) }, h(AddIcon, { class: "size-[24px] rotate-[45deg]" }))));
+        }))))), isQRScannerForm && (h("div", { key: '26d98b8f4214d2ec2df7dcc360ba39af29f8bc40', class: "overflow-hidden w-full" }, h("input", { key: 'f1f00cff8e82845ddcc138e232b72525091854c6', dir: "ltr", autofocus: true, type: "text", spellcheck: "false", autocomplete: "off", disabled: disableInputs, onBlur: this.focusInputs, onKeyDown: this.onKeyDown, value: (_z = this.inputs) === null || _z === void 0 ? void 0 : _z.qrCode, placeholder: this.locale.qrCode, onInput: event => this.setInputValue('qrCode', event.target.value), class: "bg-transparent flex-1 outline-none border-b border-[#ddd] text-[#424242] w-full text-center p-[7px] text-[16px] transition-all duration-300 focus:border-[#3071a9] focus:scale-110 focus:-translate-y-[8px]" }))), !isQRScannerForm && (h("div", { key: 'ebdb3667b0d0785ff7f226e189f0ce8a86af97a0', class: "flex w-full overflow-hidden gap-[75px]" }, h("input", { key: 'eb25f844d143e5c1e2c21070fabd2502adba2861', dir: "ltr", autofocus: true, type: "text", spellcheck: "false", autocomplete: "off", disabled: disableInputs, onKeyDown: this.onKeyDown, value: (_0 = this.inputs) === null || _0 === void 0 ? void 0 : _0.invoice, placeholder: this.locale.invoice, onInput: event => this.setInputValue('invoice', event.target.value), class: "bg-transparent flex-1 outline-none border-b border-[#ddd] text-[#424242] w-full text-center p-[7px] text-[16px] transition-all duration-300 focus:border-[#3071a9] focus:scale-110 focus:-translate-y-[8px]" }), h("input", { key: 'f6979a7700afcf58e43d6a8f2c040790553c4ddf', dir: "ltr", type: "text", spellcheck: "false", autocomplete: "off", disabled: disableInputs, onKeyDown: this.onKeyDown, value: (_1 = this.inputs) === null || _1 === void 0 ? void 0 : _1.jobNumber, placeholder: this.locale.jobNumber, onInput: event => this.setInputValue('jobNumber', event.target.value), class: "bg-transparent flex-1 outline-none border-b border-[#ddd] text-[#424242] w-full text-center p-[7px] text-[16px] transition-all duration-300 focus:border-[#3071a9] focus:scale-110 focus:-translate-y-[8px]" }))), h("button", { key: 'bf285fd6413dcc8cde6d527813db1e16307468d0', onClick: this.submit, disabled: !isFormValid || disableInputs, class: "text-[22px] transition duration-500 hover: mt-[16px] disabled:opacity-50 text-white w-full max-w-[250px] px-[8px] h-[40px] enabled:hover:scale-110 flex gap-[8px] border rounded-[4px] enabled:shadow items-center justify-center border-[#27ae60] bg-[#32b267] enabled:hover:border-[#27ae5fc1] enabled:hover:bg-[#32b267c7]" }, h(ActivationIcon, { key: 'ad380f096290a206a19449928f42efb5550adc30', class: "size-[30px] [&_circle]:fill-white stroke-white text-red-300" }), h("span", { key: '5d6ffb12f5c2ebe79d483141e3eb5c012d185e11' }, this.locale.claim))), h("div", { key: 'f30065ad52e07d019c196e7ad36e0b25d8ec23e1', class: "shrink-0 h-[16px]" })))));
     }
     static get is() { return "vehicle-item-claim-form"; }
     static get encapsulation() { return "shadow"; }
@@ -295,34 +283,7 @@ export class VehicleItemClaimForm {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "language": {
-                "type": "string",
-                "attribute": "language",
-                "mutable": false,
-                "complexType": {
-                    "original": "LanguageKeys",
-                    "resolved": "\"ar\" | \"en\" | \"ku\" | \"ru\"",
-                    "references": {
-                        "LanguageKeys": {
-                            "location": "import",
-                            "path": "~types/locale",
-                            "id": "src/global/types/locale.ts::LanguageKeys"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "defaultValue": "'en'"
+                "reflect": false
             },
             "item": {
                 "type": "unknown",
@@ -330,7 +291,7 @@ export class VehicleItemClaimForm {
                 "mutable": false,
                 "complexType": {
                     "original": "VehicleServiceItemDTO",
-                    "resolved": "{ group: VehicleServiceItemGroup; showDocumentUploader: boolean; documentUploaderIsRequired: boolean; name: string; description: string; title: string; image: string; type: string; typeEnum: \"Free\" | \"Paid\"; activatedAt: string; expiresAt?: string; status: string; statusEnum: \"Processed\" | \"Expired\" | \"Pending\" | \"Cancelled\" | \"ActivationRequired\"; campaignID?: number; campaignUniqueReference: string; packageCode: string; cost?: number; claimDate?: string; modelCostID?: number; serviceItemID: number; paidServiceInvoiceLineID?: number; companyID: string; companyName: string; invoiceNumber: string; jobNumber: string; maximumMileage?: number; claimable: boolean; claimingMethodEnum: \"ClaimByScanningQRCode\" | \"ClaimByEnteringInvoiceAndJobNumber\"; vehicleInspectionID: string; signature: string; signatureExpiry: string; }",
+                    "resolved": "{ group: VehicleServiceItemGroup; showDocumentUploader: boolean; warnings?: VehicleItemWarning[]; printUrl?: string; documentUploaderIsRequired: boolean; name: string; description: string; title: string; image: string; type: string; typeEnum: \"Free\" | \"Paid\"; activatedAt: string; expiresAt?: string; status: string; statusEnum: \"Processed\" | \"Expired\" | \"Pending\" | \"Cancelled\" | \"ActivationRequired\"; campaignID?: number; campaignUniqueReference: string; packageCode: string; cost?: number; claimDate?: string; modelCostID?: number; serviceItemID: number; paidServiceInvoiceLineID?: number; companyID: string; companyName: string; invoiceNumber: string; jobNumber: string; maximumMileage?: number; claimable: boolean; claimingMethodEnum: \"ClaimByScanningQRCode\" | \"ClaimByEnteringInvoiceAndJobNumber\"; vehicleInspectionID: string; signature: string; signatureExpiry: string; }",
                     "references": {
                         "VehicleServiceItemDTO": {
                             "location": "import",
@@ -346,8 +307,7 @@ export class VehicleItemClaimForm {
                     "text": ""
                 },
                 "getter": false,
-                "setter": false,
-                "defaultValue": "null"
+                "setter": false
             },
             "maximumDocumentFileSizeInMb": {
                 "type": "number",
@@ -368,13 +328,13 @@ export class VehicleItemClaimForm {
                 "setter": false,
                 "reflect": false
             },
-            "unInvoicedByBrokerName": {
-                "type": "string",
-                "attribute": "un-invoiced-by-broker-name",
+            "uploadMultipleDocuments": {
+                "type": "boolean",
+                "attribute": "upload-multiple-documents",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "boolean",
+                    "resolved": "boolean",
                     "references": {}
                 },
                 "required": false,
@@ -386,32 +346,7 @@ export class VehicleItemClaimForm {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "defaultValue": "null"
-            },
-            "canceledItems": {
-                "type": "unknown",
-                "attribute": "canceled-items",
-                "mutable": false,
-                "complexType": {
-                    "original": "VehicleServiceItemDTO[]",
-                    "resolved": "VehicleServiceItemDTO[]",
-                    "references": {
-                        "VehicleServiceItemDTO": {
-                            "location": "import",
-                            "path": "~types/generated/vehicle-lookup/vehicle-service-item-dto",
-                            "id": "src/global/types/generated/vehicle-lookup/vehicle-service-item-dto.ts::VehicleServiceItemDTO"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "defaultValue": "null"
+                "defaultValue": "true"
             },
             "loadingStateChange": {
                 "type": "unknown",
@@ -431,23 +366,28 @@ export class VehicleItemClaimForm {
                 "getter": false,
                 "setter": false
             },
-            "handleClaiming": {
+            "locale": {
                 "type": "unknown",
-                "attribute": "handle-claiming",
+                "attribute": "locale",
                 "mutable": false,
                 "complexType": {
-                    "original": "(payload: ClaimFormPayload) => void",
-                    "resolved": "(payload: ClaimFormPayload) => void",
+                    "original": "{ sharedLocales: SharedLocales } & ClaimFormType",
+                    "resolved": "{ sharedLocales: { lang?: string; direction?: string; language?: string; noData?: string; errors?: { noBaseUrl?: string; invalidVin?: string; vinNumberRequired?: string; partNumberRequired?: string; wrongResponseFormat?: string; noPartsFound?: string; noServiceAvailable?: string; wrongFormStructure?: string; wildCard?: string; requestFailedPleaseTryAgainLater?: string; }; }; } & { name?: string; print?: string; expand?: string; uploadSingleDocument?: string; uploadMultipleDocument?: string; serviceType?: string; documentLimitError?: string; documentRequiredError?: string; activationDate?: string; expireDate?: string; packageCode?: string; scanTheVoucher?: string; qrCode?: string; processing?: string; enterServiceInfo?: string; invoice?: string; jobNumber?: string; claim?: string; }",
                     "references": {
-                        "ClaimFormPayload": {
-                            "location": "local",
-                            "path": "/home/vsts/work/1/s/ADP.WebComponents/adp-web-components/src/components/vehicle-lookup/vehicle-item-claim-form.tsx",
-                            "id": "src/components/vehicle-lookup/vehicle-item-claim-form.tsx::ClaimFormPayload"
+                        "SharedLocales": {
+                            "location": "import",
+                            "path": "~features/multi-lingual",
+                            "id": "src/features/multi-lingual/index.ts::SharedLocales"
+                        },
+                        "ClaimFormType": {
+                            "location": "import",
+                            "path": "~locales/vehicleLookup/claimableItems/type",
+                            "id": "src/locales/vehicleLookup/claimableItems/type.ts::ClaimFormType"
                         }
                     }
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -455,57 +395,50 @@ export class VehicleItemClaimForm {
                 "getter": false,
                 "setter": false
             },
-            "locale": {
+            "handleClaiming": {
                 "type": "unknown",
-                "attribute": "locale",
+                "attribute": "handle-claiming",
                 "mutable": false,
                 "complexType": {
-                    "original": "ClaimFormType",
-                    "resolved": "{ document?: string; name?: string; serviceType?: string; documentLimitError?: string; documentRequiredError?: string; activationDate?: string; expireDate?: string; packageCode?: string; scanTheVoucher?: string; qrCode?: string; processing?: string; warning?: string; skipServicesWarning?: string; confirmSkipServices?: string; notInvoiced?: string; confirmNotInvoiced?: string; enterServiceInfo?: string; invoice?: string; jobNumber?: string; claim?: string; }",
+                    "original": "(payload: ClaimFormPayload) => Promise<void>",
+                    "resolved": "(payload: ClaimFormPayload) => Promise<void>",
                     "references": {
-                        "ClaimFormType": {
-                            "location": "import",
-                            "path": "~locales/vehicleLookup/claimableItems/type",
-                            "id": "src/locales/vehicleLookup/claimableItems/type.ts::ClaimFormType"
+                        "ClaimFormPayload": {
+                            "location": "local",
+                            "path": "/home/vsts/work/1/s/ADP.WebComponents/adp-web-components/src/components/vehicle-lookup/vehicle-item-claim-form.tsx",
+                            "id": "src/components/vehicle-lookup/vehicle-item-claim-form.tsx::ClaimFormPayload"
+                        },
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
                         }
                     }
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""
                 },
                 "getter": false,
-                "setter": false,
-                "defaultValue": "claimFormSchema.getDefault()"
+                "setter": false
             }
         };
     }
     static get states() {
         return {
-            "claimViaBarcodeScanner": {},
-            "sharedLocales": {},
-            "internalVin": {},
+            "expandedImage": {},
             "uploadProgress": {},
-            "isLoading": {},
             "isOpened": {},
-            "isDocumentError": {},
-            "selectedFile": {},
-            "internalItem": {},
-            "confirmServiceCancellation": {},
-            "confirmUnInvoicedTBPVehicles": {},
-            "internalCanceledItem": {},
-            "documentError": {},
-            "readyToClaim": {},
-            "qrCode": {},
-            "invoice": {},
-            "job": {}
+            "isLoading": {},
+            "confirmationStates": {},
+            "errors": {},
+            "inputs": {}
         };
     }
     static get methods() {
         return {
-            "quite": {
+            "open": {
                 "complexType": {
                     "signature": "() => Promise<void>",
                     "parameters": [],
@@ -513,6 +446,10 @@ export class VehicleItemClaimForm {
                         "Promise": {
                             "location": "global",
                             "id": "global::Promise"
+                        },
+                        "KeyboardEvent": {
+                            "location": "global",
+                            "id": "global::KeyboardEvent"
                         }
                     },
                     "return": "Promise<void>"
@@ -522,17 +459,21 @@ export class VehicleItemClaimForm {
                     "tags": []
                 }
             },
-            "getQrValue": {
+            "close": {
                 "complexType": {
-                    "signature": "() => Promise<string>",
-                    "parameters": [],
+                    "signature": "(forceClose?: boolean) => Promise<void>",
+                    "parameters": [{
+                            "name": "forceClose",
+                            "type": "boolean",
+                            "docs": ""
+                        }],
                     "references": {
                         "Promise": {
                             "location": "global",
                             "id": "global::Promise"
                         }
                     },
-                    "return": "Promise<string>"
+                    "return": "Promise<void>"
                 },
                 "docs": {
                     "text": "",
@@ -565,26 +506,11 @@ export class VehicleItemClaimForm {
     static get elementRef() { return "el"; }
     static get watchers() {
         return [{
-                "propName": "language",
-                "methodName": "changeLanguage"
+                "propName": "expandedImage",
+                "methodName": "onImageViewerToggles"
             }, {
                 "propName": "isLoading",
                 "methodName": "onIsLoadingChange"
-            }, {
-                "propName": "canceledItems",
-                "methodName": "changeInternalCanceledItem"
-            }, {
-                "propName": "unInvoicedByBrokerName",
-                "methodName": "changeConfirmUnInvoicedTBPVehicles"
-            }, {
-                "propName": "vin",
-                "methodName": "changeInternalVin"
-            }, {
-                "propName": "item",
-                "methodName": "changeInternalItem"
-            }, {
-                "propName": "isOpened",
-                "methodName": "onOpenChange"
             }];
     }
 }