adp-web-components 0.0.13 → 0.0.16

package/dist/esm/dynamic-claim.entry.js

@@ -1,302 +0,0 @@
-/*!
- * Built by ShiftSoftware
- * Copyright (c)
- */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-ef54644b.js';
-import { c as cn } from './cn-cc419b94.js';
-import { g as getVehicleInformation } from './vehicleInformation-f7290628.js';
-
-const expiredSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9ImJsYWNrIiBzdHJva2U9ImJsYWNrIiAvPgogICAgICAgIDxwYXRoIGQ9Ik0xNiAxNkw4IDgiIHN0cm9rZS13aWR0aD0iMS4yIiBzdHJva2U9ImJsYWNrIiAvPgogICAgICAgIDxwYXRoIGQ9Ik0xNiA4TDggMTYiIHN0cm9rZS13aWR0aD0iMS4yIiBzdHJva2U9ImJsYWNrIiAvPgogICAgPC9nPgo8L3N2Zz4=';
-
-const pendingSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9IiNhMWExYTEiIHN0cm9rZT0iI2ExYTFhMSIgLz4KICAgICAgICA8cmVjdCB4PSI5LjUiIHk9IjgiIHdpZHRoPSIyIiBoZWlnaHQ9IjgiIGZpbGw9IiNhMWExYTEiIC8+CiAgICAgICAgPHJlY3QgeD0iMTIuNSIgeT0iOCIgd2lkdGg9IjIiIGhlaWdodD0iOCIgZmlsbD0iI2ExYTFhMSIgLz4KICAgIDwvZz4KPC9zdmc+';
-
-const cancelledSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9IiNhODAwMDAiIHN0cm9rZT0iI2E4MDAwMCIgLz4KICAgICAgICA8cGF0aCBkPSJNMTggMThMNiA2IiBzdHJva2Utd2lkdGg9IjEuMiIgc3Ryb2tlPSIjYTgwMDAwIiAvPgogICAgPC9nPgo8L3N2Zz4=';
-
-const processedSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9IiMzMDcxYTkiIHN0cm9rZT0iIzMwNzFhOSIgLz4KICAgICAgICA8cGF0aCBkPSJNOC41IDExTDExLjM5MzkgMTMuODkzOUMxMS40NTI1IDEzLjk1MjUgMTEuNTQ3NSAxMy45NTI1IDExLjYwNjEgMTMuODkzOUwxOS41IDYiIHN0cm9rZT0iIzMwNzFhOSIKICAgICAgICAgICAgc3Ryb2tlLXdpZHRoPSIxLjIiIC8+CiAgICA8L2c+Cjwvc3ZnPg==';
-
-const dynamicClaimCss = "*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;border:0 solid #e5e7eb;box-sizing:border-box}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}/*! tailwindcss v3.4.15 | MIT License | https://tailwindcss.com*/:after,:before{--tw-content:\"\"}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.visible{visibility:visible}.collapse{visibility:collapse}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.block{display:block}.flex{display:flex}.table{display:table}.hidden{display:none}.flex-shrink{flex-shrink:1}.border-collapse{border-collapse:collapse}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.border{border-width:1px}.outline{outline-style:solid}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}:host{all:initial!important;display:block;flex:1 1 0!important;flex-shrink:0!important;width:100%!important}*{box-sizing:content-box;font-family:Arial;margin:revert;padding:revert}.dynamic-claim-wrapper{background:#fdfdfd;border:1px solid #dcdcdc;border-radius:5px;box-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);overflow:hidden;padding:0;position:relative}.dynamic-claim-header{background:#f6f6f6;border:1px solid #ededed;padding:15px 0;text-align:center}.dynamic-claim-header-vin{display:inline-block;transition:.4s}.idle .dynamic-claim-header-vin,.loading .dynamic-claim-header-vin{opacity:0;transform:scale(150%);visibility:hidden}.dynamic-claim-body{display:flex;overflow-x:scroll;padding:100px 30px;transition:scrollbar-color .5s ease}.idle .dynamic-claim-body,.loading .dynamic-claim-body{pointer-events:none}.dynamic-claim-wrapper ::-webkit-scrollbar{height:10px;width:10px}.dynamic-claim-wrapper ::-webkit-scrollbar-track{background:#f6f6f6;border-radius:5px;border-top:1px solid #dcdcdc;border-top-left-radius:0;border-top-right-radius:0}.idle .dynamic-claim-body::-webkit-scrollbar-thumb,.loading .dynamic-claim-body::-webkit-scrollbar-thumb{background:transparent}.dynamic-claim-wrapper ::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:10px}.dynamic-claim-wrapper ::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.dynamic-claim-progress-lane,.loading-lane{align-items:center;background-color:#f2f2f2;border:1px solid #ddd;border-radius:10px;display:flex;flex:1;flex-direction:row;height:10px;justify-content:space-around;position:relative}.idle .dynamic-claim-progress-lane,.loading .dynamic-claim-progress-lane{background-color:transparent;border:1px solid transparent}.loading-lane{position:absolute;visibility:hidden;width:calc(100% - 60px)}.loading .loading-lane{visibility:visible}.dynamic-claim-progress-bar{background-image:linear-gradient(180deg,#428bca,#3071a9);border:1px solid #ddd;border-radius:10px;height:10px;left:0;position:absolute;transition:all;transition-duration:.5s;transition-timing-function:ease-in-out;width:0;z-index:0}.idle .dynamic-claim-progress-bar,.loading .dynamic-claim-progress-bar{opacity:0;width:0!important}.dynamic-claim-item{align-items:center;display:flex;flex-direction:column;font-size:14px;gap:5px;min-width:250px}.popup-position-ref{bottom:0;display:flex;height:0;justify-content:center;position:absolute;width:0}.popup-container{position:fixed;z-index:100}.dynamic-claim-item-popup-info{background-color:#f9f9f9;border:1px solid #ddd;border-radius:5px;color:#282828;opacity:0;padding:20px;transition:.4s;visibility:hidden;width:auto}.dynamic-claim-item-popup-info-triangle.show,.dynamic-claim-item-popup-info.show{opacity:1;visibility:visible}.dynamic-claim-item-popup-info table{border-collapse:collapse;width:100%}.dynamic-claim-item-popup-info table td,.dynamic-claim-item-popup-info table th{border-bottom:1px solid #ddd;padding:10px 50px 10px 10px;text-align:left;white-space:nowrap}.dynamic-claim-item-popup-info table td{font-weight:400}.dynamic-claim-item-popup-info .claim-button{justify-content:center;margin:15px auto auto;width:80%}.dynamic-claim-item-popup-info-triangle{display:flex;justify-content:center;opacity:0;position:relative;transform:translateY(-9px);transition:.4s;visibility:hidden;width:100%;z-index:101}.dynamic-claim-item-popup-info-triangle-up{border-bottom:10px solid #ddd}.dynamic-claim-item-popup-info-triangle-up,.dynamic-claim-item-popup-info-triangle-up2{border-left:10px solid transparent;border-right:10px solid transparent;height:0;position:absolute;width:0}.dynamic-claim-item-popup-info-triangle-up2{border-bottom:10px solid #f9f9f9;margin-top:1px}.dynamic-claim-item-header{align-items:center;cursor:pointer;display:flex;flex-direction:column;height:3em;line-height:1em;padding:10px 0;position:relative;transition:.4s}.dynamic-claim-item-header.load-animation{animation:item-header-fade-in .65s ease forwards}@keyframes item-header-fade-in{0%{opacity:0;transform:translateY(-5px) scale(70%)}to{opacity:1;transform:translateY(0) scale(100%)}}.dynamic-claim-item-header span{font-weight:700}.dynamic-claim-item-header img{transition:.4s}.dynamic-claim-item-header:hover>img{transform:rotate(1turn) scale(125%)}.idle .dynamic-claim-item-header,.loading .dynamic-claim-item-header{opacity:0;transform:translateY(-5px) scale(70%)}.dynamic-claim-item-footer{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;height:4.5em;line-height:1.5em;margin:0;overflow:hidden;padding:0 20px;text-align:center;text-overflow:ellipsis;transition:.4s}.dynamic-claim-item-footer.load-animation{animation:item-footer-fade-in .65s ease forwards}@keyframes item-footer-fade-in{0%{opacity:0;transform:translateY(5px) scale(70%);visibility:hidden}to{opacity:1;transform:translateY(0) scale(100%);visibility:visible}}.idle .dynamic-claim-item-footer,.loading .dynamic-claim-item-footer{opacity:0;transform:translateY(5px) scale(70%);visibility:hidden}.dynamic-claim-item-circle{background-color:#a1a1a1;border:5px double #ececec;border-radius:50%;height:18px;transition:.4s;width:18px;z-index:1}.dynamic-claim-item-circle.load-animation{animation:item-circle-fade-in .65s ease forwards}@keyframes item-circle-fade-in{0%{opacity:0;transform:scale(150%);visibility:hidden}to{opacity:1;transform:scale(100%);visibility:visible}}.idle .dynamic-claim-item-circle,.loading .dynamic-claim-item-circle{opacity:0;transform:scale(150%);visibility:hidden}.dynamic-claim-item.processed .dynamic-claim-item-circle{background-color:#3071a9}.dynamic-claim-item.processed .dynamic-claim-item-header{color:#3071a9}.dynamic-claim-item.expired .dynamic-claim-item-circle{background-color:#282828}.dynamic-claim-item.expired .dynamic-claim-item-headaer{color:#282828}.dynamic-claim-item.cancelled .dynamic-claim-item-circle{background-color:#a80000}.dynamic-claim-item.cancelled .dynamic-claim-item-header{color:#a80000}.dynamic-claim-item.pending .dynamic-claim-item-circle{background-color:#00a300}.dynamic-claim-item.pending .dynamic-claim-item-header{color:#00a300}.dynamic-claim-loading-slider{border-radius:4px;height:10px;left:0;overflow-x:hidden;position:relative;position:absolute;top:0;width:100%}.dynamic-claim-loading-slider-line{background:#ddd;height:10px;opacity:0;position:absolute;width:150%}.dynamic-claim-loading-slider-subline{background-image:linear-gradient(180deg,#428bca,#3071a9);height:10px;position:absolute}.dynamic-claim-wrapper.loading .dynamic-claim-inc{animation:dynamic-claim-increase 2.5s ease infinite}.dynamic-claim-wrapper.loading .dynamic-claim-dec{animation:dynamic-claim-decrease 2.5s ease 1s infinite}@keyframes dynamic-claim-increase{0%{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes dynamic-claim-decrease{0%{left:-80%;width:80%}to{left:110%;width:10%}}.dynamic-claim-button{align-items:center;border:none;border-radius:5px;color:#fff;cursor:pointer;display:flex;font-weight:700;gap:3px;outline:none;padding:0 10px 0 0;transition:.3s}.dynamic-claim-button svg{transition:.2s}.claim-button{stroke:#27ae60;fill:#27ae60;background-color:transparent;border:1px solid #27ae60;color:#27ae60}.claim-button circle{fill:#2ecc71}.claim-button:hover{stroke:#fff;fill:#fff;background-color:#2ecc71;color:#fff}.claim-button:hover circle{fill:#fff}.claim-button:active{background-color:#27ae60}.claim-button:active svg{transform:scale(125%)}.cancel-button{stroke:#c0392b;fill:#c0392b;background-color:transparent;border:1px solid #c0392b;color:#c0392b}.cancel-button circle{fill:#c0392b;transition:.1s}.cancel-button:hover{stroke:#fff;fill:#fff;background-color:#e74c3c;color:#fff}.cancel-button:hover circle{fill:#fff}.static{position:static}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.m-\\[3px\\]{margin:3px}.my-4{margin-bottom:1rem;margin-top:1rem}.ml-1{margin-left:.25rem}.border-separate{border-collapse:separate}.list-disc{list-style-type:disc}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-1{gap:.25rem}.pl-10{padding-left:2.5rem}";
-const DynamicClaimStyle0 = dynamicClaimCss;
-
-let mockData = {};
-const icons = {
-    expired: expiredSvg,
-    pending: pendingSvg,
-    processed: processedSvg,
-    cancelled: cancelledSvg,
-};
-const DynamicClaim = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        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.isIdle = true;
-        this.popupClasses = '';
-        this.externalVin = null;
-        this.activePopupIndex = null;
-        this.vehicleInformation = undefined;
-        this.errorMessage = null;
-        this.isLoading = false;
-        this.loadingStateChange = undefined;
-        this.loadedResponse = undefined;
-    }
-    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('Wrong response format');
-                if (!Array.isArray(vehicleResponse.serviceItems))
-                    throw new Error('No Service Available');
-                this.vehicleInformation = vehicleResponse;
-            }
-            this.errorMessage = null;
-            this.isLoading = false;
-        }
-        catch (error) {
-            if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
-                return;
-            this.isLoading = false;
-            this.vehicleInformation = null;
-            this.errorMessage = error.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) => {
-                try {
-                    const vehicleInformation = this.vehicleInformation;
-                    const payload = {
-                        vin: vehicleInformation.vin,
-                        brandIntegrationID: vehicleInformation.identifiers.brandIntegrationID,
-                        invoice: code,
-                        saleInformation: vehicleInformation.saleInformation,
-                        serviceItem: this.dynamicRedeem.item,
-                        cancelledServiceItems: this.dynamicRedeem.canceledItems,
-                    };
-                    const response = await fetch('/api/vehicle/swift-claim', {
-                        method: 'POST',
-                        headers: {
-                            'Content-Type': 'application/json',
-                        },
-                        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('Request failed please try again later');
-                    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) {
-        return (h("div", { 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, "Service Type:"), h("td", null, item.type.charAt(0).toUpperCase() + item.type.slice(1))), h("tr", null, h("th", null, "Activation Date"), h("td", null, item.activatedAt)), h("tr", null, h("th", null, "Expiry Date"), h("td", null, item.expiresAt)), h("tr", null, h("th", null, "Claimed At"), h("td", null, item.redeemDate)), h("tr", null, h("th", null, "Redeeming Dealer"), h("td", null, item.dealerName)), h("tr", null, h("th", null, "Invoice Number"), h("td", null, item.invoiceNumber)), h("tr", null, h("th", null, "WIP"), h("td", null, item.wip)), h("tr", null, h("th", null, "Menu Code"), h("td", null, item.menuCode)))), item.status === 'pending' && (h("button", { onClick: () => this.claim(item), class: "dynamic-claim-button 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, "Claim")))))));
-    }
-    render() {
-        var _a, _b;
-        const serviceItems = ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceItems) || [];
-        return (h(Host, { key: '15b709f7252b85f308c880576dd4f8ff6a7dc666' }, h("dynamic-redeem", { key: '71a57f4626d0f394c2293db5bfccaf477c5c3f1e', id: "dynamic-redeem" }), h("div", { key: '3e247cedd1e720c89a30af72f8c9758f7a5642fb', class: cn('dynamic-claim-wrapper', { loading: this.isLoading, idle: this.isIdle }) }, h("div", { key: 'd6aea716001e09c9ff3180889afc5daca008b130', class: "dynamic-claim-header" }, h("strong", { key: 'f9469ece92c4e189eed94a119d233787d78aa8b1', onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-header-vin load-animation" }, this.errorMessage && h("span", { key: 'b132706208c827613e967186ba98a1314d9aaf08', style: { color: 'red' } }, this.errorMessage), !this.errorMessage && ((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vin))), h("div", { key: '849960f27d5188e3ab088c5de8d0bebc25723829', class: "dynamic-claim-body" }, h("div", { key: 'bdbd37aa75a00973008634299d1768dcbe95843f', class: "loading-lane" }, h("div", { key: '6a17f141b034edbcd38b86979431c3ff26614d00', class: "dynamic-claim-loading-slider" }, h("div", { key: '34597a589f5dab07e60959ba09d39876901f2ee1', class: "dynamic-claim-loading-slider-line" }), h("div", { key: '4a2483d4997fff60631cd01302d272665e2d2736', class: "dynamic-claim-loading-slider-subline dynamic-claim-inc" }), h("div", { key: 'c05466961bfcfd2580f670c57178492f31729f52', class: "dynamic-claim-loading-slider-subline dynamic-claim-dec" }))), h("div", { key: 'ac968ede27ec14df080f8c17758e071cfa272d2d', 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, item.status.charAt(0).toUpperCase() + item.status.slice(1)), 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: '720ee8e73001f6c4304f9e0af8212e37fc69e74a', class: "dynamic-claim-progress-bar" }))))));
-    }
-    get el() { return getElement(this); }
-    static get watchers() { return {
-        "isLoading": ["onLoadingChange"],
-        "vehicleInformation": ["resetProgressBar"],
-        "popupClasses": ["windowScrollListener"]
-    }; }
-};
-DynamicClaim.style = DynamicClaimStyle0;
-
-export { DynamicClaim as dynamic_claim };

package/dist/esm/image-expansion-08c4bf0d.js

@@ -1,73 +0,0 @@
-/*!
- * Built by ShiftSoftware
- * Copyright (c)
- */
-const eyeSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIgogICAgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWV5ZSI+CiAgICA8cGF0aCBkPSJNMi4wNjIgMTIuMzQ4YTEgMSAwIDAgMSAwLS42OTYgMTAuNzUgMTAuNzUgMCAwIDEgMTkuODc2IDAgMSAxIDAgMCAxIDAgLjY5NiAxMC43NSAxMC43NSAwIDAgMS0xOS44NzYgMCIgLz4KICAgIDxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjMiIC8+Cjwvc3ZnPg==';
-
-function openImageViewer(context, target, imageSrc) {
-    if (context.expandedImage === imageSrc)
-        return;
-    context.originalImage = target;
-    const expandedImageRef = context.el.shadowRoot.getElementById('expanded-image');
-    expandedImageRef.src = target.src;
-    document.addEventListener('keydown', context.closeImageListener);
-    const rect = target.getBoundingClientRect();
-    document.body.style.overflow = 'hidden';
-    Object.assign(expandedImageRef.style, {
-        top: `${rect.top}px`,
-        pointerEvents: 'auto',
-        left: `${rect.left}px`,
-        transitionDuration: '0s',
-        width: `${rect.width}px`,
-        height: `${rect.height}px`,
-    });
-    setTimeout(() => {
-        const naturalWidth = target.naturalWidth;
-        const naturalHeight = target.naturalHeight;
-        const maxWidth = window.innerWidth - 160;
-        const maxHeight = window.innerHeight - 32;
-        const aspectRatio = naturalWidth / naturalHeight;
-        let width, height;
-        if (maxWidth / aspectRatio <= maxHeight) {
-            width = maxWidth;
-            height = maxWidth / aspectRatio;
-        }
-        else {
-            height = maxHeight;
-            width = maxHeight * aspectRatio;
-        }
-        expandedImageRef.style.transitionDuration = '0.3s';
-        Object.assign(expandedImageRef.style, {
-            opacity: '1',
-            width: `${width}px`,
-            height: `${height}px`,
-            top: `${(window.innerHeight - height) / 2}px`,
-            left: `${(window.innerWidth - width) / 2}px`,
-        });
-        context.expandedImage = imageSrc;
-    }, 200);
-}
-function closeImageViewer(context, event) {
-    if (event && event.key !== 'Escape')
-        return;
-    document.removeEventListener('keydown', context.closeImageListener);
-    const expandedImageRef = context.el.shadowRoot.getElementById('expanded-image');
-    const rect = context.originalImage.getBoundingClientRect();
-    Object.assign(expandedImageRef.style, {
-        top: `${rect.top}px`,
-        pointerEvents: 'none',
-        left: `${rect.left}px`,
-        width: `${rect.width}px`,
-        height: `${rect.height}px`,
-        transitionDuration: '0.3s',
-    });
-    setTimeout(() => {
-        expandedImageRef.src = '';
-        expandedImageRef.style.opacity = '0';
-        expandedImageRef.style.transitionDuration = '0s';
-    }, 300);
-    document.body.style.overflow = '';
-    context.expandedImage = null;
-}
-
-export { closeImageViewer as c, eyeSvg as e, openImageViewer as o };

package/dist/esm/paint-thickness.entry.js

@@ -1,114 +0,0 @@
-/*!
- * Built by ShiftSoftware
- * Copyright (c)
- */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-ef54644b.js';
-import { L as Loading } from './Loading-61648252.js';
-import { g as getVehicleInformation } from './vehicleInformation-f7290628.js';
-import { o as openImageViewer, c as closeImageViewer, e as eyeSvg } from './image-expansion-08c4bf0d.js';
-import { c as cn } from './cn-cc419b94.js';
-import './loader-027b88af.js';
-
-const paintThicknessCss = "*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;border:0 solid #e5e7eb;box-sizing:border-box}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}/*! tailwindcss v3.4.15 | MIT License | https://tailwindcss.com*/:after,:before{--tw-content:\"\"}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.block{display:block}:host{all:initial!important;display:block}*{font-family:Arial}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.z-40{z-index:40}.float-right{float:right}.mx-auto{margin-left:auto;margin-right:auto}.mr-\\[16px\\]{margin-right:16px}.mt-\\[12px\\]{margin-top:12px}.mt-\\[16px\\]{margin-top:16px}.flex{display:flex}.table{display:table}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-0{height:0}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.h-\\[40px\\]{height:40px}.h-\\[50px\\]{height:50px}.max-h-\\[70dvh\\]{max-height:70dvh}.min-h-\\[100px\\]{min-height:100px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.min-w-\\[100px\\]{min-width:100px}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.border-collapse{border-collapse:collapse}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.scale-0{--tw-scale-x:0;--tw-scale-y:0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded-\\[4px\\]{border-radius:4px}.rounded-\\[8px\\]{border-radius:8px}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.\\!border-none{border-style:none!important}.border-\\[\\#d6d8dc\\]{--tw-border-opacity:1;border-color:rgb(214 216 220/var(--tw-border-opacity,1))}.bg-\\[\\#e1e3e5\\]{--tw-bg-opacity:1;background-color:rgb(225 227 229/var(--tw-bg-opacity,1))}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[10px\\]{padding-left:10px;padding-right:10px}.px-\\[15px\\]{padding-left:15px;padding-right:15px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.px-\\[30px\\]{padding-left:30px;padding-right:30px}.py-\\[15px\\]{padding-bottom:15px;padding-top:15px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.py-\\[20px\\]{padding-bottom:20px;padding-top:20px}.py-\\[8px\\]{padding-bottom:8px;padding-top:8px}.pt-\\[4px\\]{padding-top:4px}.text-center{text-align:center}.text-\\[18px\\]{font-size:18px}.text-\\[20px\\]{font-size:20px}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-\\[\\#383c43\\]{--tw-text-opacity:1;color:rgb(56 60 67/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.delay-200{transition-delay:.2s}.duration-100{transition-duration:.1s}.duration-300{transition-duration:.3s}.duration-700{transition-duration:.7s}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}.hover\\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.z-50{z-index:50}.size-\\[40px\\]{height:40px;width:40px}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin-2s{animation:spin 2s linear infinite}";
-const PaintThicknessStyle0 = paintThicknessCss;
-
-let mockData = {};
-const PaintThickness = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.closeImageListener = (event) => {
-            this.closeImage(event);
-        };
-        this.openImage = (target, imageSrc) => {
-            openImageViewer(this, target, imageSrc);
-        };
-        this.closeImage = (event) => {
-            closeImageViewer(this, event);
-        };
-        this.baseUrl = '';
-        this.isDev = false;
-        this.queryString = '';
-        this.loadingStateChange = undefined;
-        this.loadedResponse = undefined;
-        this.state = 'idle';
-        this.externalVin = null;
-        this.errorMessage = null;
-        this.expandedImage = null;
-        this.vehicleInformation = undefined;
-    }
-    handleSettingData(response) {
-        if (!response.paintThickness)
-            response.paintThickness = { imageGroups: [], parts: [] };
-        if (!response.paintThickness.parts || !Array.isArray(response.paintThickness.parts))
-            response.paintThickness.parts = [];
-        if (!response.paintThickness.imageGroups || !Array.isArray(response.paintThickness.imageGroups))
-            response.paintThickness.imageGroups = [];
-        this.vehicleInformation = response;
-    }
-    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.state = 'idle';
-                return;
-            }
-            if (this.state === 'data' || this.state === 'error') {
-                this.state = (this.state + '-loading');
-            }
-            else
-                this.state = 'loading';
-            await new Promise(r => {
-                scopedTimeoutRef = setTimeout(r, 700);
-                this.networkTimeoutRef = scopedTimeoutRef;
-            });
-            const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData }, headers) : newData;
-            if (this.networkTimeoutRef === scopedTimeoutRef) {
-                if (!vehicleResponse)
-                    throw new Error('Wrong response format');
-                this.handleSettingData(vehicleResponse);
-            }
-            this.errorMessage = null;
-            this.state = 'data';
-        }
-        catch (error) {
-            if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
-                return;
-            this.state = 'error';
-            this.vehicleInformation = null;
-            this.errorMessage = error.message;
-        }
-    }
-    async fetchData(requestedVin = this.externalVin, headers = {}) {
-        await this.setData(requestedVin, headers);
-    }
-    async loadingListener() {
-        if (this.loadingStateChange)
-            this.loadingStateChange(this.state.includes('loading'));
-    }
-    async setMockData(newMockData) {
-        mockData = newMockData;
-    }
-    render() {
-        var _a, _b;
-        const { imageGroups, parts } = (this === null || this === void 0 ? void 0 : this.vehicleInformation) ? (_a = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.paintThickness : { imageGroups: [], parts: [] };
-        return (h(Host, { key: 'dd25115d7451c326da5411d30b8cebeac06ea3b4' }, h("div", { key: 'ebec5094a98846ffbe00abcbdc5bb5b987262548', class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: '67d4926b51399a2f990251d95a58558d07c64865' }, h(Loading, { key: 'd56bac7fe821253d2d9aea3a31e19a55002dc1ce', isLoading: this.state.includes('loading') }), h("div", { key: '27b2f517a1f974182c5704d9682213662f3dd2d3', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: 'f9bdf1767f4e8d6f24f018a60649f54b75151de2', class: cn('text-center pt-[4px] text-[20px]', { 'text-red-600': !!this.errorMessage }) }, (_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vin), ['error', 'error-loading'].includes(this.state) && (h("div", { key: 'd2b739c8f39501a2335a312b6c9d0a0431104300', class: "py-[16px]" }, h("div", { key: '06e78434d8122f36a26faa5fed05a64d759c18c3', class: " px-[16px] py-[8px] border reject-card text-[20px] rounded-[8px] w-fit mx-auto" }, this.errorMessage))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: 'f17f4c019ed1357fb40f6f32c125918ab24069ce', class: "flex mt-[12px] w-full max-h-[70dvh] overflow-hidden mx-auto rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: 'b79eed13d13b7b91aff4aeb4b2280eb349592896', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, "Paint Thickeness"), h("div", { key: 'aab4ba79f226602f913652e27341df333f5be00d', class: "h-0 overflow-auto flex-1" }, !parts.length && h("div", { key: 'edf880bf05cc8c31000960c1ee9471d166444541', class: "h-[50px] px-[30px] flex items-center justify-center text-[18px]" }, "No parts are available."), !!parts.length && (h("table", { key: 'ddac23c3ba00bb44e58f2b5dfaa11034d4f13594', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: 'c39718f9cd059c765c51b90ba2f2f4e570b9778b', class: "top-0 font-bold sticky bg-white" }, h("tr", { key: 'ba28cd9cadfc036162a735d7353a089a581a8559' }, ['Part', 'Left', 'Right'].map(title => (h("th", { key: title, class: "px-[15px] min-w-[100px] py-[15px] text-center whitespace-nowrap border-b border-[#d6d8dc]" }, title))))), h("tbody", { key: '6049aecd19316b1d7e1c79606d7cf304b0b260ec' }, parts.map((part, idx) => (h("tr", { class: "transition-colors duration-100 hover:bg-slate-100", key: part.part }, ['part', 'left', 'right'].map(key => (h("td", { key: part.part + key, class: cn('px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]', {
-                '!border-none': idx === parts.length - 1,
-            }) }, part[key] || '...')))))))))))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: '73bfbe41ad8f91591c23b0dccd7be84b4505ede8' }, !imageGroups.length && h("div", { key: '33c2491e22faf7a5f11b6ec2ee62a1b758123b8e', class: "h-[40px] px-[30px] flex text-red-500 items-center justify-center text-[18px]" }, "No image groups are available."), !!imageGroups.length && (h("div", { key: '02103207298b679bdbe8d336c70d2cb8936087a4', class: "py-[16px] gap-[16px] justify-center flex flex-wrap px-[24px] w-full" }, imageGroups.map(imageGroup => (h("div", { class: "shrink-0 rounded-lg shadow-sm border overflow-hidden flex flex-col", key: imageGroup.name }, h("h1", { class: "text-center border-b bg-slate-200 font-semibold p-[6px]" }, imageGroup.name), h("div", { class: "flex p-[12px] gap-[8px]" }, imageGroup.images.map(image => (h("div", { class: "flex gap-[8px]", key: image }, h("button", { onClick: ({ target }) => this.openImage(target, image), 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: eyeSvg }), h("span", { class: "text-white" }, "Expand")), h("img", { class: "w-auto h-[150px] cursor-pointer shadow-sm rounded-lg transition-all duration-300", src: image }))))))))), h("div", { key: '7e239537ed9d3b07119fbf15fcb8cb238280c095', onClick: () => this.closeImage(), style: { backdropFilter: this.expandedImage ? 'blur(3px)' : 'blur(0px)' }, class: cn('pointer-events-none w-[100dvw] h-[100dvh] fixed top-0 z-10 left-0 opacity-0 bg-black/40 transition-all duration-400', {
-                'pointer-events-auto opacity-100 delay-200': this.expandedImage,
-            }) }, h("button", { key: 'a961871288f09b8776ca9530a6e5ae56133cb3bc', class: "flex flex-col mt-[16px] items-center justify-center size-12 float-right mr-[16px]", onClick: () => this.closeImage() }, h("div", { key: '6db275131cf9b431540c2402552449a4ca2d4289', class: "h-1 w-12 rounded-full rotate-45 absolute bg-white" }), h("div", { key: '1b0c9149a6d22c436e89baf35fb146c08d13a40a', class: "h-1 w-12 rounded-full -rotate-45 absolute bg-white" }))), h("img", { key: '38939c47ad696305c5cc2b3ccb4c72112eea2cce', alt: "", id: "expanded-image", class: "fixed opacity-0 z-40 transition-all rounded-lg" }))))))))));
-    }
-    get el() { return getElement(this); }
-    static get watchers() { return {
-        "state": ["loadingListener"]
-    }; }
-};
-PaintThickness.style = PaintThicknessStyle0;
-
-export { PaintThickness as paint_thickness };