adp-web-components 0.0.27 → 0.0.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (147) hide show
  1. package/dist/cjs/{Loading-14fca13b.js → Loading-6f4f0127.js} +1 -1
  2. package/dist/cjs/dead-stock-lookup.cjs.entry.js +5 -5
  3. package/dist/cjs/distributor-lookup.cjs.entry.js +5 -5
  4. package/dist/cjs/dynamic-claim_6.cjs.entry.js +139 -71
  5. package/dist/cjs/dynamic-redeem.cjs.entry.js +21 -9
  6. package/dist/cjs/form-input.cjs.entry.js +1 -1
  7. package/dist/cjs/general-inquiry-form.cjs.entry.js +5 -2131
  8. package/dist/cjs/get-local-language-42973450.js +153 -0
  9. package/dist/cjs/{index-97b8da6d.js → index-846c93d2.js} +6 -1
  10. package/dist/cjs/index.esm-c628daeb.js +2135 -0
  11. package/dist/cjs/loader.cjs.js +2 -2
  12. package/dist/cjs/manufacturer-lookup.cjs.entry.js +5 -5
  13. package/dist/cjs/{partInformation-07651204.js → partInformation-2b4e0593.js} +1 -1
  14. package/dist/cjs/shift-components.cjs.js +2 -2
  15. package/dist/cjs/vehicle-lookup.cjs.entry.js +6 -5
  16. package/dist/collection/components/part-lookup/dead-stock-lookup.js +2 -2
  17. package/dist/collection/components/part-lookup/distributor-lookup.js +2 -2
  18. package/dist/collection/components/part-lookup/manufacturer-lookup.js +2 -2
  19. package/dist/collection/components/vehicle-lookup/components/CardsContainer.js +3 -2
  20. package/dist/collection/components/vehicle-lookup/components/SSCTable.js +3 -2
  21. package/dist/collection/components/vehicle-lookup/components/StatusCard.js +2 -2
  22. package/dist/collection/components/vehicle-lookup/dynamic-claim.css +1 -1
  23. package/dist/collection/components/vehicle-lookup/dynamic-claim.js +53 -13
  24. package/dist/collection/components/vehicle-lookup/dynamic-redeem.css +1 -1
  25. package/dist/collection/components/vehicle-lookup/dynamic-redeem.js +49 -10
  26. package/dist/collection/components/vehicle-lookup/paint-thickness.js +47 -8
  27. package/dist/collection/components/vehicle-lookup/service-history.js +42 -3
  28. package/dist/collection/components/vehicle-lookup/vehicle-accessories.js +48 -9
  29. package/dist/collection/components/vehicle-lookup/vehicle-lookup.js +44 -19
  30. package/dist/collection/components/vehicle-lookup/vehicle-specification.js +42 -3
  31. package/dist/collection/components/vehicle-lookup/warranty-details.js +76 -38
  32. package/dist/collection/global/api/partInformation.js +1 -1
  33. package/dist/collection/global/api/vehicleInformation.js +2 -2
  34. package/dist/collection/global/lib/get-local-language.js +19 -0
  35. package/dist/collection/global/types/locales/error-schema.js +9 -0
  36. package/dist/collection/global/types/locales/index.js +22 -0
  37. package/dist/collection/global/types/locales/vehicle-lookup/accessories-schema.js +13 -0
  38. package/dist/collection/global/types/locales/vehicle-lookup/dynamic-claim-schema.js +21 -0
  39. package/dist/collection/global/types/locales/vehicle-lookup/dynamic-redeem-schema.js +28 -0
  40. package/dist/collection/global/types/locales/vehicle-lookup/index.js +21 -0
  41. package/dist/collection/global/types/locales/vehicle-lookup/paint-thickness-schema.js +14 -0
  42. package/dist/collection/global/types/locales/vehicle-lookup/service-history-schema.js +15 -0
  43. package/dist/collection/global/types/locales/vehicle-lookup/specification-schema.js +14 -0
  44. package/dist/collection/global/types/locales/vehicle-lookup/warranty-schema.js +23 -0
  45. package/dist/components/dead-stock-lookup.js +1 -1
  46. package/dist/components/distributor-lookup.js +1 -1
  47. package/dist/components/dynamic-claim.js +1 -1
  48. package/dist/components/dynamic-redeem.js +1 -1
  49. package/dist/components/form-input.js +1 -1
  50. package/dist/components/general-inquiry-form.js +1 -1
  51. package/dist/components/index.js +1 -1
  52. package/dist/components/manufacturer-lookup.js +1 -1
  53. package/dist/components/p-0ae60f32.js +5 -0
  54. package/dist/components/p-1a626dfd.js +5 -0
  55. package/dist/components/{p-4bf4435e.js → p-1d80419b.js} +1 -1
  56. package/dist/components/p-1ea3089a.js +5 -0
  57. package/dist/components/p-2e747eb3.js +5 -0
  58. package/dist/components/p-4f99745c.js +5 -0
  59. package/dist/components/{p-c4fad245.js → p-609c2470.js} +1 -1
  60. package/dist/components/p-6c064413.js +5 -0
  61. package/dist/components/p-7360f9b1.js +5 -0
  62. package/dist/components/p-79ea7639.js +5 -0
  63. package/dist/components/p-a21e2e2e.js +5 -0
  64. package/dist/components/{p-be0a5ab5.js → p-b2051f01.js} +1 -1
  65. package/dist/components/p-e446fb9d.js +5 -0
  66. package/dist/components/p-eb89583a.js +5 -0
  67. package/dist/components/{p-b90fd51c.js → p-f001d15b.js} +1 -1
  68. package/dist/components/p-f691e103.js +5 -0
  69. package/dist/components/paint-thickness.js +1 -1
  70. package/dist/components/service-history.js +1 -1
  71. package/dist/components/vehicle-accessories.js +1 -1
  72. package/dist/components/vehicle-lookup.js +1 -1
  73. package/dist/components/vehicle-specification.js +1 -1
  74. package/dist/components/warranty-details.js +1 -1
  75. package/dist/esm/{Loading-2b8a745c.js → Loading-f4d666ee.js} +1 -1
  76. package/dist/esm/dead-stock-lookup.entry.js +5 -5
  77. package/dist/esm/distributor-lookup.entry.js +5 -5
  78. package/dist/esm/dynamic-claim_6.entry.js +139 -71
  79. package/dist/esm/dynamic-redeem.entry.js +21 -9
  80. package/dist/esm/form-input.entry.js +1 -1
  81. package/dist/esm/general-inquiry-form.entry.js +2 -2128
  82. package/dist/esm/get-local-language-85ed0b3b.js +150 -0
  83. package/dist/esm/{index-ff1dab22.js → index-33ae6859.js} +6 -1
  84. package/dist/esm/index.esm-46e0cdad.js +2132 -0
  85. package/dist/esm/loader.js +3 -3
  86. package/dist/esm/manufacturer-lookup.entry.js +5 -5
  87. package/dist/esm/{partInformation-096a8f55.js → partInformation-f40b1fe6.js} +1 -1
  88. package/dist/esm/shift-components.js +3 -3
  89. package/dist/esm/vehicle-lookup.entry.js +6 -5
  90. package/dist/locales/ar.json +105 -0
  91. package/dist/locales/en.json +105 -0
  92. package/dist/locales/ku.json +105 -0
  93. package/dist/shift-components/p-062cd94b.entry.js +5 -0
  94. package/dist/shift-components/p-0e0b69a1.entry.js +5 -0
  95. package/dist/shift-components/{p-f37b60d5.js → p-0f0e54c1.js} +2 -2
  96. package/dist/shift-components/p-10aae582.entry.js +5 -0
  97. package/dist/shift-components/p-1de8531d.entry.js +5 -0
  98. package/dist/shift-components/p-2e747eb3.js +5 -0
  99. package/dist/shift-components/{p-fad254c9.entry.js → p-496a721b.entry.js} +1 -1
  100. package/dist/shift-components/p-832fd942.entry.js +5 -0
  101. package/dist/shift-components/p-9120c049.entry.js +5 -0
  102. package/dist/shift-components/{p-e35e44a4.js → p-99d314b5.js} +1 -1
  103. package/dist/shift-components/p-c4efbdc3.js +5 -0
  104. package/dist/shift-components/p-d49f73db.entry.js +5 -0
  105. package/dist/shift-components/p-e446fb9d.js +5 -0
  106. package/dist/shift-components/shift-components.esm.js +1 -1
  107. package/dist/types/components/vehicle-lookup/components/CardsContainer.d.ts +3 -1
  108. package/dist/types/components/vehicle-lookup/components/SSCTable.d.ts +3 -1
  109. package/dist/types/components/vehicle-lookup/components/StatusCard.d.ts +3 -1
  110. package/dist/types/components/vehicle-lookup/dynamic-claim.d.ts +10 -5
  111. package/dist/types/components/vehicle-lookup/dynamic-redeem.d.ts +10 -5
  112. package/dist/types/components/vehicle-lookup/paint-thickness.d.ts +6 -1
  113. package/dist/types/components/vehicle-lookup/service-history.d.ts +6 -1
  114. package/dist/types/components/vehicle-lookup/vehicle-accessories.d.ts +6 -1
  115. package/dist/types/components/vehicle-lookup/vehicle-lookup.d.ts +5 -3
  116. package/dist/types/components/vehicle-lookup/vehicle-specification.d.ts +6 -1
  117. package/dist/types/components/vehicle-lookup/warranty-details.d.ts +10 -5
  118. package/dist/types/components.d.ts +18 -0
  119. package/dist/types/global/lib/get-local-language.d.ts +2 -0
  120. package/dist/types/global/types/locales/error-schema.d.ts +7 -0
  121. package/dist/types/global/types/locales/index.d.ts +220 -0
  122. package/dist/types/global/types/locales/vehicle-lookup/accessories-schema.d.ts +15 -0
  123. package/dist/types/global/types/locales/vehicle-lookup/dynamic-claim-schema.d.ts +31 -0
  124. package/dist/types/global/types/locales/vehicle-lookup/dynamic-redeem-schema.d.ts +45 -0
  125. package/dist/types/global/types/locales/vehicle-lookup/index.d.ts +189 -0
  126. package/dist/types/global/types/locales/vehicle-lookup/paint-thickness-schema.d.ts +17 -0
  127. package/dist/types/global/types/locales/vehicle-lookup/service-history-schema.d.ts +19 -0
  128. package/dist/types/global/types/locales/vehicle-lookup/specification-schema.d.ts +17 -0
  129. package/dist/types/global/types/locales/vehicle-lookup/warranty-schema.d.ts +35 -0
  130. package/package.json +9 -4
  131. package/dist/components/p-2741b156.js +0 -5
  132. package/dist/components/p-2ea90585.js +0 -5
  133. package/dist/components/p-4f08bcb8.js +0 -5
  134. package/dist/components/p-514c4736.js +0 -5
  135. package/dist/components/p-6ffb4e5d.js +0 -5
  136. package/dist/components/p-9245caae.js +0 -5
  137. package/dist/components/p-c62be897.js +0 -5
  138. package/dist/components/p-d4718f3b.js +0 -5
  139. package/dist/components/p-d999f3c4.js +0 -5
  140. package/dist/shift-components/p-1719e164.entry.js +0 -5
  141. package/dist/shift-components/p-26b9d31a.entry.js +0 -5
  142. package/dist/shift-components/p-33e4c335.entry.js +0 -5
  143. package/dist/shift-components/p-4f08bcb8.js +0 -5
  144. package/dist/shift-components/p-9f58a33b.entry.js +0 -5
  145. package/dist/shift-components/p-d03dade1.entry.js +0 -5
  146. package/dist/shift-components/p-d1ffe0eb.entry.js +0 -5
  147. package/dist/shift-components/p-f6764fb5.entry.js +0 -5
@@ -2,9 +2,11 @@
2
2
  * Built by ShiftSoftware
3
3
  * Copyright (c)
4
4
  */
5
- import { r as registerInstance, h, H as Host, g as getElement } from './index-ff1dab22.js';
5
+ import { r as registerInstance, h, H as Host, g as getElement } from './index-33ae6859.js';
6
6
  import { c as cn } from './cn-cc419b94.js';
7
- import { L as Loading$1, l as loaderSvg$1 } from './Loading-2b8a745c.js';
7
+ import { l as localeSchema, g as getLocaleLanguage } from './get-local-language-85ed0b3b.js';
8
+ import { L as Loading$1, l as loaderSvg$1 } from './Loading-f4d666ee.js';
9
+ import './index.esm-46e0cdad.js';
8
10
 
9
11
  const expiredSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9ImJsYWNrIiBzdHJva2U9ImJsYWNrIiAvPgogICAgICAgIDxwYXRoIGQ9Ik0xNiAxNkw4IDgiIHN0cm9rZS13aWR0aD0iMS4yIiBzdHJva2U9ImJsYWNrIiAvPgogICAgICAgIDxwYXRoIGQ9Ik0xNiA4TDggMTYiIHN0cm9rZS13aWR0aD0iMS4yIiBzdHJva2U9ImJsYWNrIiAvPgogICAgPC9nPgo8L3N2Zz4=';
10
12
 
@@ -25,7 +27,7 @@ const vehicleRequestHeaders = {
25
27
  cityIntegrationId: 'City-Integration-Id',
26
28
  brandIntegrationId: 'Brand-Integration-Id',
27
29
  companyIntegrationId: 'Company-Integration-Id',
28
- companyBranchIntegrationId: 'Company-Branch-Integration-Id'
30
+ companyBranchIntegrationId: 'Company-Branch-Integration-Id',
29
31
  };
30
32
  const getVehicleInformation = async (component, generalProps, headers = {}) => {
31
33
  const { notAvailableMessage, mockData, vin, scopedTimeoutRef, middlewareCallback } = generalProps;
@@ -33,7 +35,7 @@ const getVehicleInformation = async (component, generalProps, headers = {}) => {
33
35
  const handleResult = (newVehicleInformation) => {
34
36
  if (networkTimeoutRef === scopedTimeoutRef) {
35
37
  if (!newVehicleInformation && vin)
36
- throw new Error(notAvailableMessage || 'Wrong response format');
38
+ throw new Error(notAvailableMessage || 'wrongResponseFormat');
37
39
  if (loadedResponse)
38
40
  loadedResponse(newVehicleInformation);
39
41
  if (middlewareCallback)
@@ -59,7 +61,7 @@ const getVehicleInformation = async (component, generalProps, headers = {}) => {
59
61
  }
60
62
  };
61
63
 
62
- 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}.w-full{width:100%}.sticky{position:sticky}.top-0{top:0}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-bottom:.5rem;margin-top:.5rem}.mt-\\[12px\\]{margin-top:12px}.h-0{height:0}.h-\\[40px\\]{height:40px}.h-\\[80px\\]{height:80px}.max-h-\\[70dvh\\]{max-height:70dvh}.min-h-\\[100px\\]{min-height:100px}.w-fit{width:fit-content}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.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))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded-\\[4px\\]{border-radius:4px}.rounded-\\[8px\\]{border-radius:8px}.border-b{border-bottom-width:1px}.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-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.px-\\[10px\\]{padding-left:10px;padding-right:10px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.py-4{padding-bottom:1rem;padding-top:1rem}.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}.text-\\[\\#383c43\\]{--tw-text-opacity:1;color:rgb(56 60 67/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.opacity-0{opacity:0}.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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.duration-700{transition-duration:.7s}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.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}.gap-1{gap:.25rem}.pl-10{padding-left:2.5rem}";
64
+ 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;padding-inline-end:50px;text-align:start;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}.w-full{width:100%}.sticky{position:sticky}.top-0{top:0}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-bottom:.5rem;margin-top:.5rem}.mt-\\[12px\\]{margin-top:12px}.h-0{height:0}.h-\\[40px\\]{height:40px}.h-\\[80px\\]{height:80px}.max-h-\\[70dvh\\]{max-height:70dvh}.min-h-\\[100px\\]{min-height:100px}.w-fit{width:fit-content}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.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))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded-\\[4px\\]{border-radius:4px}.rounded-\\[8px\\]{border-radius:8px}.border-b{border-bottom-width:1px}.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-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.px-\\[10px\\]{padding-left:10px;padding-right:10px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.py-4{padding-bottom:1rem;padding-top:1rem}.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}.text-\\[\\#383c43\\]{--tw-text-opacity:1;color:rgb(56 60 67/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.opacity-0{opacity:0}.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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.duration-700{transition-duration:.7s}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.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}.gap-1{gap:.25rem}";
63
65
  const DynamicClaimStyle0 = dynamicClaimCss;
64
66
 
65
67
  let mockData$5 = {};
@@ -93,15 +95,23 @@ const DynamicClaim = class {
93
95
  this.baseUrl = undefined;
94
96
  this.isDev = false;
95
97
  this.queryString = '';
98
+ this.language = 'en';
99
+ this.loadingStateChange = undefined;
100
+ this.loadedResponse = undefined;
101
+ this.locale = localeSchema.getDefault();
96
102
  this.isIdle = true;
97
103
  this.popupClasses = '';
104
+ this.isLoading = false;
98
105
  this.externalVin = null;
106
+ this.errorMessage = null;
99
107
  this.activePopupIndex = null;
100
108
  this.vehicleInformation = undefined;
101
- this.errorMessage = null;
102
- this.isLoading = false;
103
- this.loadingStateChange = undefined;
104
- this.loadedResponse = undefined;
109
+ }
110
+ async componentWillLoad() {
111
+ await this.changeLanguage(this.language);
112
+ }
113
+ async changeLanguage(newLanguage) {
114
+ this.locale = await getLocaleLanguage(newLanguage);
105
115
  }
106
116
  async componentDidLoad() {
107
117
  this.dynamicClaimBody = this.el.shadowRoot.querySelector('.dynamic-claim-body');
@@ -134,9 +144,9 @@ const DynamicClaim = class {
134
144
  const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$5 }, headers) : newData;
135
145
  if (this.networkTimeoutRef === scopedTimeoutRef) {
136
146
  if (!vehicleResponse)
137
- throw new Error('Wrong response format');
147
+ throw new Error('wrongResponseFormat');
138
148
  if (!Array.isArray(vehicleResponse.serviceItems))
139
- throw new Error('No Service Available');
149
+ throw new Error('noServiceAvailable');
140
150
  this.vehicleInformation = vehicleResponse;
141
151
  }
142
152
  this.errorMessage = null;
@@ -319,12 +329,14 @@ const DynamicClaim = class {
319
329
  this.handleRedeemScanner();
320
330
  }
321
331
  createPopup(item) {
322
- 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")))))));
332
+ const texts = this.locale.vehicleLookup.dynamicClaim;
333
+ return (h("div", { dir: this.locale.direction, class: "popup-position-ref" }, h("div", { class: "popup-container" }, h("div", { class: cn('dynamic-claim-item-popup-info-triangle', this.popupClasses) }, h("div", { class: "dynamic-claim-item-popup-info-triangle-up" }), h("div", { class: "dynamic-claim-item-popup-info-triangle-up2" })), h("div", { class: cn('dynamic-claim-item-popup-info', this.popupClasses) }, h("table", null, h("tbody", null, h("tr", null, h("th", null, texts.serviceType), h("td", null, item.type.charAt(0).toUpperCase() + item.type.slice(1))), h("tr", null, h("th", null, texts.activationDate), h("td", null, item.activatedAt)), h("tr", null, h("th", null, texts.expireDate), h("td", null, item.expiresAt)), h("tr", null, h("th", null, texts.claimAt), h("td", null, item.redeemDate)), h("tr", null, h("th", null, texts.redeemingDealer), h("td", null, item.dealerName)), h("tr", null, h("th", null, texts.invoiceNumber), h("td", null, item.invoiceNumber)), h("tr", null, h("th", null, texts.wip), h("td", null, item.wip)), h("tr", null, h("th", null, texts.claim), h("td", null, item.menuCode)))), item.status === 'pending' && (h("button", { onClick: () => this.claim(item), class: "claim-button" }, h("svg", { width: "30px", height: "30px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { "stroke-width": "0" }), h("g", { "stroke-linecap": "round", "stroke-linejoin": "round" }), h("g", null, h("circle", { cx: "12", cy: "12", r: "8", "fill-opacity": "0.24" }), h("path", { d: "M8.5 11L11.3939 13.8939C11.4525 13.9525 11.5475 13.9525 11.6061 13.8939L19.5 6", "stroke-width": "1.2" }))), h("span", null, texts.claim)))))));
323
334
  }
324
335
  render() {
325
336
  var _a, _b;
326
337
  const serviceItems = ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceItems) || [];
327
- return (h(Host, { key: '6e978e300bae2dd76b153421a56180adac9b0181' }, h("dynamic-redeem", { key: '98762e62d38fedf77d328e8dc2da6c832b927f0c', id: "dynamic-redeem" }), h("div", { key: '46b817f023ce25c860c79c4fafe7c963b9acd6be', class: cn('dynamic-claim-wrapper', { loading: this.isLoading, idle: this.isIdle }) }, h("div", { key: '3e93ee7b596ab9d4fb338e5a7c5973d102d6db2b', class: "dynamic-claim-header" }, h("strong", { key: '037bbee7e1aa4c3cf36d93fdc20c01959f194fca', onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-header-vin load-animation" }, this.errorMessage && h("span", { key: 'd68269004e338abd8d08c8bb840e5084a3b428a7', style: { color: 'red' } }, this.errorMessage), !this.errorMessage && ((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vin))), h("div", { key: '7cc8f93760c08f55af3d56515c928c2a888c8f18', class: "dynamic-claim-body" }, h("div", { key: '471ede9a4acb83195d9b0f78a36d00364abd99cf', class: "loading-lane" }, h("div", { key: 'f734fcaca3e8653870e76a3e72c45a1cbb2bd320', class: "dynamic-claim-loading-slider" }, h("div", { key: '747118edb9777ee3833bcb27c01d3f8b19cef6c6', class: "dynamic-claim-loading-slider-line" }), h("div", { key: '3e65f85d83ba6aaa062e83989683675ad0ec5b7c', class: "dynamic-claim-loading-slider-subline dynamic-claim-inc" }), h("div", { key: '48a3aa105f30e70ff0bdb1f335a404e0a88fd791', class: "dynamic-claim-loading-slider-subline dynamic-claim-dec" }))), h("div", { key: '9009de9a5e02782908f0b4d79fa89aaf43dbba2d', class: "dynamic-claim-progress-lane" }, serviceItems.map((item, idx) => {
338
+ const texts = this.locale.vehicleLookup.dynamicClaim;
339
+ return (h(Host, { key: 'f2cfdf00146271981ecae27ecb4ec236828ff867' }, h("dynamic-redeem", { key: '8e48bb690fc3b836d62de1f070aafaf04745d0b0', language: this.language, id: "dynamic-redeem" }), h("div", { key: '6094c0caafc5739c604d9d4c4c47e333afe1f7e4', class: cn('dynamic-claim-wrapper', { loading: this.isLoading, idle: this.isIdle }) }, h("div", { key: 'd60e75f110d3c256accc79a902002308b446474a', class: "dynamic-claim-header" }, h("strong", { key: '27b8c733c52f1da4a4698d3b8088ffd9f327d135', onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-header-vin load-animation" }, this.errorMessage && h("span", { key: 'abc5f47fb708a682ff332490bd0c141067918e20', style: { color: 'red' } }, this.locale.errors[this.errorMessage] || this.errorMessage), !this.errorMessage && ((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vin))), h("div", { key: '60821e446380af29fe6ac69b8c857389852c38c3', class: "dynamic-claim-body" }, h("div", { key: 'a377796da2f109c6d7f6a191e0460557353ae699', class: "loading-lane" }, h("div", { key: '4a0160292a9b3c37144d31abb5522fb75290e4d6', class: "dynamic-claim-loading-slider" }, h("div", { key: 'c9b863afa89ff6d8e849174e3a6c9d1095ab79cf', class: "dynamic-claim-loading-slider-line" }), h("div", { key: '9b3281714f0bfbe115a97fa6a36a650a791b77c9', class: "dynamic-claim-loading-slider-subline dynamic-claim-inc" }), h("div", { key: 'ba327f47aa070fa45e5e8153834918cb68e18e34', class: "dynamic-claim-loading-slider-subline dynamic-claim-dec" }))), h("div", { key: 'c9ac7e0575e62b7a67312b4144c61350c351630d', class: "dynamic-claim-progress-lane" }, serviceItems.map((item, idx) => {
328
340
  let statusClass = '';
329
341
  if (item.status === 'pending') {
330
342
  if (serviceItems.findIndex(i => i.status === 'pending') === idx)
@@ -332,11 +344,12 @@ const DynamicClaim = class {
332
344
  }
333
345
  else
334
346
  statusClass = item.status;
335
- 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)));
336
- }), h("div", { key: '1e05a3af9851d7418c31e4fd16d9ec4836930bdc', class: "dynamic-claim-progress-bar" }))))));
347
+ return (h("div", { key: item.name, class: cn('dynamic-claim-item', statusClass), onMouseLeave: this.onMouseLeave }, h("div", { onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-item-header load-animation", onMouseEnter: event => this.onMouseEnter(event.target, idx) }, h("img", { src: icons[item.status], alt: "status icon" }), h("span", null, texts[item.status]), this.activePopupIndex === idx && this.createPopup(item)), h("div", { onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-item-circle load-animation" }), h("p", { onAnimationEnd: this.removeLoadAnimationClass, class: "dynamic-claim-item-footer load-animation" }, item.name)));
348
+ }), h("div", { key: 'ef131184baaf7d319a167ab3915a37ef8aa4c366', class: "dynamic-claim-progress-bar" }))))));
337
349
  }
338
350
  get el() { return getElement(this); }
339
351
  static get watchers() { return {
352
+ "language": ["changeLanguage"],
340
353
  "isLoading": ["onLoadingChange"],
341
354
  "vehicleInformation": ["resetProgressBar"],
342
355
  "popupClasses": ["windowScrollListener"]
@@ -431,14 +444,22 @@ const PaintThickness = class {
431
444
  this.baseUrl = '';
432
445
  this.isDev = false;
433
446
  this.queryString = '';
447
+ this.language = 'en';
434
448
  this.loadingStateChange = undefined;
435
449
  this.loadedResponse = undefined;
450
+ this.locale = localeSchema.getDefault();
436
451
  this.state = 'idle';
437
452
  this.externalVin = null;
438
- this.errorMessage = null;
439
453
  this.expandedImage = null;
454
+ this.errorMessage = null;
440
455
  this.vehicleInformation = undefined;
441
456
  }
457
+ async componentWillLoad() {
458
+ await this.changeLanguage(this.language);
459
+ }
460
+ async changeLanguage(newLanguage) {
461
+ this.locale = await getLocaleLanguage(newLanguage);
462
+ }
442
463
  handleSettingData(response) {
443
464
  if (!response.paintThickness)
444
465
  response.paintThickness = { imageGroups: [], parts: [] };
@@ -474,7 +495,7 @@ const PaintThickness = class {
474
495
  const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$4 }, headers) : newData;
475
496
  if (this.networkTimeoutRef === scopedTimeoutRef) {
476
497
  if (!vehicleResponse)
477
- throw new Error('Wrong response format');
498
+ throw new Error('wrongResponseFormat');
478
499
  this.handleSettingData(vehicleResponse);
479
500
  }
480
501
  this.errorMessage = null;
@@ -500,15 +521,17 @@ const PaintThickness = class {
500
521
  }
501
522
  render() {
502
523
  var _a, _b;
524
+ const texts = this.locale.vehicleLookup.paintThickness;
503
525
  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: [] };
504
- return (h(Host, { key: '355f2df0a3e80a89c0fdcb8aabb0e40ccc700bf6' }, h("div", { key: '5aeb480a0b710ceb13d0bffcf6b71cc75b833143', class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: '63cd6f54659b1cf4431fdf625993b3fa7a29bd39' }, h(Loading$1, { key: '012fb79e5ffbb120046a6ce2827f36406a0b048f', isLoading: this.state.includes('loading') }), h("div", { key: '1adcc025c0aec78f5c49898f8aa3aa7254692ade', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: '73c09edaee5d53821c5ccbf664b939417138eb1b', 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: '24c95b96da8bf0281f8651933bf52de6c09159e7', class: "py-[16px]" }, h("div", { key: '0f93d0e593172c81f9e9793385fcb41ba442708e', 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: '253e4eae86844769ef81f278f87583fbab791dea', class: "flex mt-[12px] w-full max-h-[70dvh] overflow-hidden mx-auto rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: '30ea8fa499edecc4d9a5f389d1b801041f3f8b41', 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: '43bc2a9e95f73d028eee8c0b1d4ab07c3a54527b', class: "h-0 overflow-auto flex-1" }, !parts.length && h("div", { key: 'e5e6e8c3baa2f98df7d800a791d3c686013e357f', class: "h-[50px] px-[30px] flex items-center justify-center text-[18px]" }, "No parts are available."), !!parts.length && (h("table", { key: '17065cf14a8db4cddad1972deb0bdb36d826be04', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: '118e8822d316131999b936404afeafd495f10c8a', class: "top-0 font-bold sticky bg-white" }, h("tr", { key: '2823f3b683e6c7416ea5a6754b63fd49f2df03ac' }, ['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: 'c5574301b73756700ff5ec867e31e379e573d96d' }, 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]', {
526
+ return (h(Host, { key: 'c016cef77b893442d0d33c4f9b986ee9d704a047' }, h("div", { key: 'db3b0f02c3423e0483a5000fa52fcd02e106f417', class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: '04f5488431c759be5a01e6bbe1d58a62b291e8f2' }, h(Loading$1, { key: '5b8a290c885e7a32f110522806f0e76545db3400', isLoading: this.state.includes('loading') }), h("div", { key: '3304d8d438eb74c7b1b0c3ce0ab6f42870dad451', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: 'c7b7b7ff56602b4dc86433e351e3b398bdc49b54', 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: 'aa565320287a2659040766032456e53b9108fddf', class: "py-[16px]" }, h("div", { key: 'e99991f62d92c8c80e2622189b481e09390a4836', class: " px-[16px] py-[8px] border reject-card text-[20px] rounded-[8px] w-fit mx-auto" }, this.locale.errors[this.errorMessage] || this.errorMessage))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: '06ddc28439757b99a2e66603a08085bfebab2887', class: "flex mt-[12px] w-full max-h-[70dvh] overflow-hidden mx-auto rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: '0191a58f1fed172f13a0c1448b0e5045f2898a2e', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, texts.paintThickness), h("div", { key: '4ac786cbfec1df9c3a034f329ce5baa1591b124b', class: "h-0 overflow-auto flex-1" }, !parts.length && h("div", { key: '46261e7f73e45ccdcfee8af1e621cd4e4f405e79', class: "h-[50px] px-[30px] flex items-center justify-center text-[18px]" }, texts.noData), !!parts.length && (h("table", { key: 'eb30840419f8daa59aeb72190640eaadbca7f9ad', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: 'e94bfe40d27f90307fbe2303d10be468515dc0a4', class: "top-0 font-bold sticky bg-white" }, h("tr", { key: '3c51cc746f226512120e40711a0109924b3b518a' }, ['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]" }, texts[title]))))), h("tbody", { key: '9634a5a5ded1cb2ffb8488e7f36408708ee20431' }, 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]', {
505
527
  '!border-none': idx === parts.length - 1,
506
- }) }, part[key] || '...')))))))))))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: '07a2c492c12647c16ac2b6e494056d9ccdb1ea55' }, !imageGroups.length && h("div", { key: '3c96acc6216c2523c1f2ea3d5d32f39072ccdc68', 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: 'b3179fc893a9f8b92395a1bedafd6955d7f5b664', 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: 'a727d06966fd3aac08d5c5f8bd16f4fe00040db2', 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', {
528
+ }) }, part[key] || '...')))))))))))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: 'd25a655f2d5f146cb84f42afea7c8d5c83e93403' }, !imageGroups.length && h("div", { key: '1541923dd14aa6f454b7213e17454880ec2903f9', class: "h-[40px] px-[30px] flex text-red-500 items-center justify-center text-[18px]" }, texts.noImageGroups), !!imageGroups.length && (h("div", { key: 'dd8785fb8af9453816c756ee253adc3f2ed273ff', 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" }, texts.expand)), h("img", { class: "w-auto h-[150px] cursor-pointer shadow-sm rounded-lg transition-all duration-300", src: image }))))))))), h("div", { key: 'a6d5c4181ee71b5f8e33e45b5f0c701dbc3ea24b', 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', {
507
529
  'pointer-events-auto opacity-100 delay-200': this.expandedImage,
508
- }) }, h("button", { key: 'dc3da2c8ac67e1c62db2958e29079b52ca514213', class: "flex flex-col mt-[16px] items-center justify-center size-12 float-right mr-[16px]", onClick: () => this.closeImage() }, h("div", { key: 'abfc5c11a56825803a3b87ee0e36f2e5a47f2953', class: "h-1 w-12 rounded-full rotate-45 absolute bg-white" }), h("div", { key: 'a37fa84c8e51ea026a2869c246645bf816effd1d', class: "h-1 w-12 rounded-full -rotate-45 absolute bg-white" }))), h("img", { key: '062421c196e4ffb107c5b0c1aa93d117bad3a18d', alt: "", id: "expanded-image", class: "fixed opacity-0 z-40 transition-all rounded-lg" }))))))))));
530
+ }) }, h("button", { key: 'e970d607cba3e4032063c3bf2b7ba69c2b21c4a4', class: "flex flex-col mt-[16px] items-center justify-center size-12 float-right mr-[16px]", onClick: () => this.closeImage() }, h("div", { key: 'e1ca12957a925aac35f8ce4180e155a72a3a5880', class: "h-1 w-12 rounded-full rotate-45 absolute bg-white" }), h("div", { key: '194f919ae1ac66550b9feb51c2d3a5bc968bb5b2', class: "h-1 w-12 rounded-full -rotate-45 absolute bg-white" }))), h("img", { key: '896ddba224ccf4f06ffc70ff13eb17eaa720330a', alt: "", id: "expanded-image", class: "fixed opacity-0 z-40 transition-all rounded-lg" }))))))))));
509
531
  }
510
532
  get el() { return getElement(this); }
511
533
  static get watchers() { return {
534
+ "language": ["changeLanguage"],
512
535
  "state": ["loadingListener"]
513
536
  }; }
514
537
  };
@@ -524,13 +547,21 @@ const ServiceHistory = class {
524
547
  this.baseUrl = '';
525
548
  this.isDev = false;
526
549
  this.queryString = '';
550
+ this.language = 'en';
527
551
  this.loadingStateChange = undefined;
528
552
  this.loadedResponse = undefined;
553
+ this.locale = localeSchema.getDefault();
529
554
  this.state = 'idle';
530
555
  this.externalVin = null;
531
556
  this.errorMessage = null;
532
557
  this.vehicleInformation = undefined;
533
558
  }
559
+ async componentWillLoad() {
560
+ await this.changeLanguage(this.language);
561
+ }
562
+ async changeLanguage(newLanguage) {
563
+ this.locale = await getLocaleLanguage(newLanguage);
564
+ }
534
565
  handleSettingData(response) {
535
566
  if (response.serviceHistory === null)
536
567
  response.serviceHistory = [];
@@ -562,7 +593,7 @@ const ServiceHistory = class {
562
593
  const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$3 }, headers) : newData;
563
594
  if (this.networkTimeoutRef === scopedTimeoutRef) {
564
595
  if (!vehicleResponse)
565
- throw new Error('Wrong response format');
596
+ throw new Error('wrongResponseFormat');
566
597
  this.handleSettingData(vehicleResponse);
567
598
  }
568
599
  this.errorMessage = null;
@@ -588,7 +619,8 @@ const ServiceHistory = class {
588
619
  }
589
620
  render() {
590
621
  var _a, _b, _c, _d;
591
- return (h(Host, { key: '1b058ba5baea7e3249a66e5b7a040a673b140345' }, h("div", { key: '414432d67e85b8ad11a0f9a3bf9cf6336e06c8ce', class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: 'd4129e8101efd34c820d64661c90c5d81a65a90c' }, h(Loading$1, { key: 'ff1d26799aceb06a1c7b22c556cc1391e3585481', isLoading: this.state.includes('loading') }), h("div", { key: '09a740c1f863f0bd90ea52e6f94c8c9add2901f4', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: '1e40aeba7672c94cb70479d8cf4ca28e217a1ac2', class: cn('text-center pt-[4px] text-[20px]', { 'text-red-600': !!this.errorMessage }) }, (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin), ['error', 'error-loading'].includes(this.state) && (h("div", { key: '4b2102507916ecdd06ce0fbc8fe5b82cf9463fe3', class: "py-[16px]" }, h("div", { key: '89a48cf522a860d2840e772ca0a2750ffd6f6652', 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: '42b2403fae1685bf6a49f756ac3a6aae31a6423d', class: "flex mt-[12px] max-h-[70dvh] overflow-hidden rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: '462678b7179bb278d9a51845fda8c98deff3a790', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, "Service History"), h("div", { key: 'a3a484027fa040a6f80b94cdd3c8fcaf5d36a977', class: "h-0 overflow-auto flex-1" }, !((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.serviceHistory.length) && h("div", { key: '4562aaa28b8941799d7203c49d0a457feb881616', class: "h-[80px] flex items-center justify-center text-[18px]" }, "No data is available."), !!((_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.serviceHistory.length) && (h("table", { key: 'cbb4515b99b33e65536d2f577439bf5c4bd19c61', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: 'a6829bbcb8578d51a4be89b02b4095b21966ed9f', class: "top-0 font-bold sticky bg-white" }, h("tr", { key: 'd6bfa489b6797e499173b8e67b28f0eb519e70ac' }, ['Branch', 'Dealer', 'Invoice No.', 'Date', 'Service Type', 'Odometer'].map(title => (h("th", { key: title, class: "px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]" }, title))))), h("tbody", { key: '27f91e98246790262d844c68290f12abdad7ba74' }, (_d = this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.serviceHistory.map((service, idx) => (h("tr", { class: "transition-colors duration-100 hover:bg-slate-100", key: service.invoiceNumber }, ['branchName', 'companyName', 'invoiceNumber', 'serviceDate', 'serviceType', 'mileage'].map(serviceType => {
622
+ const texts = this.locale.vehicleLookup.serviceHistory;
623
+ return (h(Host, { key: 'e5eefccce115cb82190384b31dda1315bde5fc70' }, h("div", { key: 'ec5be235022339b210e9346035c54d32e931a1ca', class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: 'c1fe096d2176c255bd481394da51b527b45cd9d7' }, h(Loading$1, { key: '4ed349910b887560911ac00ecd10fc01a6567837', isLoading: this.state.includes('loading') }), h("div", { key: 'a0617a3631df80fb41dbcf0c962fdd2e864d3493', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: '2215c44cf4c0a4fe5675b12a59d0f6c77ed7fe49', class: cn('text-center pt-[4px] text-[20px]', { 'text-red-600': !!this.errorMessage }) }, (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin), ['error', 'error-loading'].includes(this.state) && (h("div", { key: 'be552c787c2c35a5c69e6a64619d75f75e1f6797', class: "py-[16px]" }, h("div", { key: '7edc33ca66e08ac62b7a01bab8bdf6644bbd63fa', class: " px-[16px] py-[8px] border reject-card text-[20px] rounded-[8px] w-fit mx-auto" }, this.locale.errors[this.errorMessage] || this.errorMessage))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: '29a7f3193a94147dbfe3ffa4b8ef2ad147868f1c', class: "flex mt-[12px] max-h-[70dvh] overflow-hidden rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: '1a94982c5578322eb257b3dceb6ff130c788d217', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, texts.serviceHistory), h("div", { key: '057c1d07e82b95ea22bbc80e5dd4b56ebdda99e4', class: "h-0 overflow-auto flex-1" }, !((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.serviceHistory.length) && h("div", { key: '976ad885407d9e02135f60a3334e3f1e6d118a9b', class: "h-[80px] flex items-center justify-center text-[18px]" }, texts.noData), !!((_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.serviceHistory.length) && (h("table", { key: '6042aa7f6766c6847173d6714254fb8f377c3ca6', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: '2ee300fe27add43c20d215653f2cbd295c08f524', class: "top-0 font-bold sticky bg-white" }, h("tr", { key: 'c5331792c19ed2f6cfa8a4551ad5cd31d6d62d2a' }, ['branch', 'dealer', 'invoiceNumber', 'date', 'serviceType', 'odometer'].map(title => (h("th", { key: title, class: "px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]" }, texts[title]))))), h("tbody", { key: '0940d07d7f4abc75f219286949ed5c347f456581' }, (_d = this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.serviceHistory.map((service, idx) => (h("tr", { class: "transition-colors duration-100 hover:bg-slate-100", key: service.invoiceNumber }, ['branchName', 'companyName', 'invoiceNumber', 'serviceDate', 'serviceType', 'mileage'].map(serviceType => {
592
624
  var _a;
593
625
  return (h("td", { key: service.invoiceNumber + serviceType, class: cn('px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]', {
594
626
  '!border-none': idx === ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceHistory.length) - 1,
@@ -597,6 +629,7 @@ const ServiceHistory = class {
597
629
  }
598
630
  get el() { return getElement(this); }
599
631
  static get watchers() { return {
632
+ "language": ["changeLanguage"],
600
633
  "state": ["loadingListener"]
601
634
  }; }
602
635
  };
@@ -621,14 +654,22 @@ const VehicleAccessories = class {
621
654
  this.baseUrl = '';
622
655
  this.isDev = false;
623
656
  this.queryString = '';
657
+ this.language = 'en';
624
658
  this.loadingStateChange = undefined;
625
659
  this.loadedResponse = undefined;
660
+ this.locale = localeSchema.getDefault();
626
661
  this.state = 'idle';
627
662
  this.externalVin = null;
628
- this.errorMessage = null;
629
663
  this.expandedImage = null;
664
+ this.errorMessage = null;
630
665
  this.vehicleInformation = undefined;
631
666
  }
667
+ async componentWillLoad() {
668
+ await this.changeLanguage(this.language);
669
+ }
670
+ async changeLanguage(newLanguage) {
671
+ this.locale = await getLocaleLanguage(newLanguage);
672
+ }
632
673
  handleSettingData(response) {
633
674
  if (!response.accessories || !Array.isArray(response.accessories))
634
675
  response.accessories = [];
@@ -660,7 +701,7 @@ const VehicleAccessories = class {
660
701
  const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$2 }, headers) : newData;
661
702
  if (this.networkTimeoutRef === scopedTimeoutRef) {
662
703
  if (!vehicleResponse)
663
- throw new Error('Wrong response format');
704
+ throw new Error('wrongResponseFormat');
664
705
  this.handleSettingData(vehicleResponse);
665
706
  }
666
707
  this.errorMessage = null;
@@ -686,8 +727,9 @@ const VehicleAccessories = class {
686
727
  }
687
728
  render() {
688
729
  var _a, _b;
730
+ const texts = this.locale.vehicleLookup.accessories;
689
731
  const accessories = (this === null || this === void 0 ? void 0 : this.vehicleInformation) ? (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.accessories : [];
690
- return (h(Host, { key: '809010a784fce81c13a9f653768bcb2f792b2a8b' }, h("div", { key: '68da5c8fccf4b24c2d3a42cf4cc3fefb7dd560ab', class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: '947bbad37c5117df4f79f2c896936a22f00b0531' }, h(Loading$1, { key: '855aa5567d59bbfac43495c5baba708fb5600c1c', isLoading: this.state.includes('loading') }), h("div", { key: '1fe9e47793a7f58b8b0f4251ced6f7ff49f93240', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: '7ed9356bf45e5b27c4c5ad032d44d3fdbf60631a', 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: 'dd349e9113ddde6a1447dd7b56d1045db29eecb6', class: "py-[16px]" }, h("div", { key: '0d720a59842a2f1e4adfdcf82bd2b443625d9c14', 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: '48030f4b6938c6174df0e80cea90221efcd80135', class: "flex mt-[12px] max-h-[70dvh] overflow-hidden rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: 'be06d52f77788855c3763833868bf8c5aa9fa259', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, "Vehicle Accessories"), h("div", { key: 'e38e31796058e2094531f1b364339dfbe6acdf77', class: "h-0 overflow-auto flex-1" }, !accessories.length && h("div", { key: 'f95c52c80f0a2dab3f0ee7e439c100b6b94a21b0', class: "h-[80px] flex items-center justify-center text-[18px]" }, "No data is available."), !!accessories.length && (h("table", { key: 'a207dd43d39984d701a654550040224866bf583b', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: 'ce3b75261934c67c9297a818fe8cfa7feaaa936c', class: "top-0 font-bold z-40 sticky bg-white" }, h("tr", { key: 'ab5f928cd658c193f9464974392dac8f937150b4' }, ['Part Number', 'Description', 'Image'].map(title => (h("th", { key: title, class: "px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]" }, title))))), h("tbody", { key: '359c90cabf19855f2fc0464c04899bdbf3890afa' }, accessories.map((accessory, idx) => {
732
+ return (h(Host, { key: '5b676008ffd07cf3c30f6a1dbef540aeddec5650' }, h("div", { key: '936db932754ee0c5774bb9bbadcab9acdf0bd8f1', dir: this.locale.direction, class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: '46029b531877e9641e0797a08449c446d6acb41d' }, h(Loading$1, { key: 'c831c9e7b6ae7e3c7748ec20a531fc653570d7a1', isLoading: this.state.includes('loading') }), h("div", { key: 'eb7b7864b47ab00025c7634995a2f3d868f379df', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: 'fdb1c1e9673a300a974e1ade26079063e5a6780e', 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: '5b777e9dabe4b1caac03d4ff4c77bc52eacafd0a', class: "py-[16px]" }, h("div", { key: 'e92c8f26bba943508ec0536f404bbf9b46b5ffef', class: " px-[16px] py-[8px] border reject-card text-[20px] rounded-[8px] w-fit mx-auto" }, this.locale.errors[this.errorMessage] || this.errorMessage))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: '7e3e5c940b3b52538c58cec0f6e9befcc8b20d85', class: "flex mt-[12px] max-h-[70dvh] overflow-hidden rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: 'fd6b52beb280f25ef122ca1616b3dc85ba868aac', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, texts.vehicleAccessories), h("div", { key: 'df4343fae41a6118c73aadf8b2451c1ed55f0b24', class: "h-0 overflow-auto flex-1" }, !accessories.length && h("div", { key: 'c634537217daeb171ba9120b75baeec052727606', class: "h-[80px] flex items-center justify-center text-[18px]" }, texts.noData), !!accessories.length && (h("table", { key: '800b8700d5d7d96cccc3c0774b7c0c6d48411e51', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: '338f1360f25eeb71b0c766bc6995dc2d794694b0', class: "top-0 font-bold z-40 sticky bg-white" }, h("tr", { key: '4d7be4a922493d6e93b9a72a6de63932bb94f642' }, ['partNumber', 'description', 'image'].map(title => (h("th", { key: title, class: "px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]" }, texts[title]))))), h("tbody", { key: 'eb798dcea38261093bc5fdfe5b015b79f3e6d6e9' }, accessories.map((accessory, idx) => {
691
733
  var _a;
692
734
  return (h("tr", { class: "transition-colors duration-100 hover:bg-slate-100", key: accessory.partNumber }, ['partNumber', 'description'].map(key => {
693
735
  var _a;
@@ -696,13 +738,14 @@ const VehicleAccessories = class {
696
738
  }) }, accessory[key] || '...'));
697
739
  }), h("td", { class: cn('px-[10px] py-[10px] text-center whitespace-nowrap border-b border-[#d6d8dc]', {
698
740
  '!border-none': idx === ((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceHistory.length) - 1,
699
- }) }, h("button", { onClick: ({ target }) => this.openImage(target, accessory.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-auto max-w-[133px] max-h-[133px] cursor-pointer shadow-sm rounded-lg transition-all duration-300", src: accessory.image })))));
700
- })), h("div", { key: '8dbd610b0699e78ff72321b3542d8a5bebaac697', onClick: () => this.closeImage(), style: { backdropFilter: this.expandedImage ? 'blur(3px)' : 'blur(0px)' }, class: cn('pointer-events-none w-[100dvw] h-[100dvh] fixed top-0 z-50 left-0 opacity-0 bg-black/40 transition-all duration-400', {
741
+ }) }, h("button", { onClick: ({ target }) => this.openImage(target, accessory.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" }, texts.expand)), h("img", { class: "w-auto h-auto max-w-[133px] max-h-[133px] cursor-pointer shadow-sm rounded-lg transition-all duration-300", src: accessory.image })))));
742
+ })), h("div", { key: 'bb875932b3315b24afd3589948936dd3b471bc56', onClick: () => this.closeImage(), style: { backdropFilter: this.expandedImage ? 'blur(3px)' : 'blur(0px)' }, class: cn('pointer-events-none w-[100dvw] h-[100dvh] fixed top-0 z-50 left-0 opacity-0 bg-black/40 transition-all duration-400', {
701
743
  'pointer-events-auto opacity-100 delay-200': this.expandedImage,
702
- }) }, h("button", { key: '504e17f2df3bbffe428e75e71b44fde9a681084e', class: "flex flex-col mt-[16px] items-center justify-center size-12 float-right mr-[16px]", onClick: () => this.closeImage() }, h("div", { key: 'ea82b4f6759a5593d057a42a18f7e116d86ee921', class: "h-1 w-12 rounded-full rotate-45 absolute bg-white" }), h("div", { key: '6aabdfaf3e10b744c6ade52e12a5b1c9bc81f5f7', class: "h-1 w-12 rounded-full -rotate-45 absolute bg-white" }))), h("img", { key: 'b0d0a64346461b81c2113f4928bb2de08abeb440', alt: "", id: "expanded-image", class: "fixed opacity-0 z-50 transition-all rounded-lg" })))))))))));
744
+ }) }, h("button", { key: '9b6a9934ecd43a4988978772d3f9ec032fc2366d', class: "flex flex-col mt-[16px] items-center justify-center size-12 float-right mr-[16px]", onClick: () => this.closeImage() }, h("div", { key: 'fc59bcd946d47fab25522506e1362ab92580efa8', class: "h-1 w-12 rounded-full rotate-45 absolute bg-white" }), h("div", { key: 'baf4b47120f23081e6f150ee3aacb8410e964c51', class: "h-1 w-12 rounded-full -rotate-45 absolute bg-white" }))), h("img", { key: '8dfbdb6402ba212b864fb7e6324db06b28e6b8b2', alt: "", id: "expanded-image", class: "fixed opacity-0 z-50 transition-all rounded-lg" })))))))))));
703
745
  }
704
746
  get el() { return getElement(this); }
705
747
  static get watchers() { return {
748
+ "language": ["changeLanguage"],
706
749
  "state": ["loadingListener"]
707
750
  }; }
708
751
  };
@@ -718,13 +761,21 @@ const VehicleSpecification = class {
718
761
  this.baseUrl = '';
719
762
  this.isDev = false;
720
763
  this.queryString = '';
764
+ this.language = 'en';
721
765
  this.loadingStateChange = undefined;
722
766
  this.loadedResponse = undefined;
767
+ this.locale = localeSchema.getDefault();
723
768
  this.state = 'idle';
724
769
  this.externalVin = null;
725
770
  this.errorMessage = null;
726
771
  this.vehicleInformation = undefined;
727
772
  }
773
+ async componentWillLoad() {
774
+ await this.changeLanguage(this.language);
775
+ }
776
+ async changeLanguage(newLanguage) {
777
+ this.locale = await getLocaleLanguage(newLanguage);
778
+ }
728
779
  async setData(newData, headers = {}) {
729
780
  clearTimeout(this.networkTimeoutRef);
730
781
  if (this.abortController)
@@ -751,7 +802,7 @@ const VehicleSpecification = class {
751
802
  const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$1 }, headers) : newData;
752
803
  if (this.networkTimeoutRef === scopedTimeoutRef) {
753
804
  if (!vehicleResponse)
754
- throw new Error('Wrong response format');
805
+ throw new Error('wrongResponseFormat');
755
806
  this.vehicleInformation = vehicleResponse;
756
807
  }
757
808
  this.errorMessage = null;
@@ -777,7 +828,8 @@ const VehicleSpecification = class {
777
828
  }
778
829
  render() {
779
830
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
780
- return (h(Host, { key: 'e96ba82b8f58b3812bfb539e6e20020635d17c13' }, h("div", { key: '65896e18a4b328b657dc7ae37506f3f090be58ef', class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: '85b32b58705d8ede8161f4bf429e4eea2eeab113' }, h(Loading$1, { key: '102144466024234e3b3d67f40a2ed613d8decb8f', isLoading: this.state.includes('loading') }), h("div", { key: 'ea3201bce6b9471c1c1b3cf2336bb4d3d820345a', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: '063a8e9ae6202a207ee9e03bb8e21c8d269f105f', class: cn('text-center pt-[4px] text-[20px]', { 'text-red-600': !!this.errorMessage }) }, (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin), ['error', 'error-loading'].includes(this.state) && (h("div", { key: '5b6e0c8f594a4609ebe476e39c607ddd16221c2a', class: "py-4" }, h("div", { key: 'cd11ab7ea9c2b17b870bce21b793b06707b729ea', 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: '9afcbe4ffc5e11f39c2ff6f284d2f0b6b9f24df4', class: "flex mt-[12px] max-h-[70dvh] overflow-hidden rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: '324be66504bbe49d03d3e777d5fa5b14c8129975', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, "Vehicle Specifications"), h("div", { key: '0875021cb9dcf017b98d516e5898c05b5803a1ba', class: "h-0 overflow-auto flex-1" }, !((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vehicleSpecification) && h("div", { key: '9132eb142b5f67fbb5310936bfba4517174eafcf', class: "h-[80px] flex items-center justify-center text-[18px]" }, "No data is available."), !!((_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.vehicleSpecification) && (h("table", { key: 'ed324bef37bc05379b5bf9f7c2e86b9a45ec732e', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: '1fc091f01a228617523d213dcdf295368f875279', class: "top-0 font-bold sticky bg-white" }, h("tr", { key: '308569c58472d2680c5e7b9ed444d0e7360948f5' }, ['Model', 'Variant', 'Katashiki', 'Model Year', 'SFX'].map(title => (h("th", { key: title, class: "px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]" }, title))))), h("tbody", { key: '9d44d2b25f0cd37603d10d4632c1adf78cbaabeb' }, h("tr", { key: 'ce399b783d636d8f7e4cb5dac62ef08ca0e2383c' }, h("td", { key: '2f3fdaac2635377722caea73a05d097686606cb7', class: "px-[10px] py-[20px] text-center whitespace-nowrap" }, ((_e = (_d = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.vehicleVariantInfo) === null || _e === void 0 ? void 0 : _e.modelCode) || '...', " ", h("br", { key: 'f7b14609c4be0a16414311c9c42f594f37bf9a5d', class: "my-2" }), ((_g = (_f = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _f === void 0 ? void 0 : _f.vehicleSpecification) === null || _g === void 0 ? void 0 : _g.modelDesc) || '...'), h("td", { key: 'a20ed93430b4d33734e068b4495623ea0cbc1872', class: "px-[10px] py-[20px] text-center whitespace-nowrap" }, ((_j = (_h = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _h === void 0 ? void 0 : _h.identifiers) === null || _j === void 0 ? void 0 : _j.variant) || '...', " ", h("br", { key: '8b77dac46b0161eca0b5d1806f643d72d787b821' }), ((_l = (_k = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _k === void 0 ? void 0 : _k.vehicleSpecification) === null || _l === void 0 ? void 0 : _l.variantDesc) || '...'), ['identifiers.katashiki', 'vehicleVariantInfo.modelYear', 'vehicleVariantInfo.sfx'].map(infoPath => {
831
+ const texts = this.locale.vehicleLookup.specification;
832
+ return (h(Host, { key: '610f4bab084478eb7f60133ed6498fc6b53a6844' }, h("div", { key: '5d25c90dd19ae1fdf84d6484881b3fceeada61c4', dir: this.locale.direction, class: "min-h-[100px] relative transition-all duration-300 overflow-hidden" }, h("div", { key: 'bd3643977e70e46e86b7516a9407679209a7d4fa' }, h(Loading$1, { key: '9064190a3698c0534e36e8bc018bbaec3b08709a', isLoading: this.state.includes('loading') }), h("div", { key: '56426c064d0a0b1273f62e78b64cca65020c72c8', class: cn('transition-all duration-700', { 'scale-0': this.state.includes('loading') || this.state === 'idle', 'opacity-0': this.state.includes('loading') }) }, h("div", { key: 'ec8f12b6d2372053c097a057ba71d072d75e4fdc', class: cn('text-center pt-[4px] text-[20px]', { 'text-red-600': !!this.errorMessage }) }, (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin), ['error', 'error-loading'].includes(this.state) && (h("div", { key: '285ac738ecc896feeda7caf81f8a41c9a99cea19', class: "py-4" }, h("div", { key: 'a29855571fcc97bc19f3196427fdf67d9cadb501', class: " px-[16px] py-[8px] border reject-card text-[20px] rounded-[8px] w-fit mx-auto" }, this.locale.errors[this.errorMessage] || this.errorMessage))), ['data', 'data-loading'].includes(this.state) && (h("div", { key: '021f7bb6c6a1c9b44ebc112c48e4789aca7d387c', class: "flex mt-[12px] max-h-[70dvh] overflow-hidden rounded-[4px] flex-col border border-[#d6d8dc]" }, h("div", { key: '43e4399b5064de1023a8e3d27fdd2632f75b3338', class: "w-full h-[40px] flex shrink-0 justify-center text-[18px] items-center text-[#383c43] text-center bg-[#e1e3e5]" }, texts.vehicleSpecification), h("div", { key: 'f0fa3e15cb9336be3a4061821438d82d9e73587c', class: "h-0 overflow-auto flex-1" }, !((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vehicleSpecification) && h("div", { key: '12d0257e9d94573a09fecda9c4fcc3e093c08f16', class: "h-[80px] flex items-center justify-center text-[18px]" }, texts.noData), !!((_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.vehicleSpecification) && (h("table", { key: 'ecc72141ecfb0b1ca2eeb4825eb6c90119089395', class: "w-full overflow-auto relative border-collapse" }, h("thead", { key: '01eeb96a4dc8c721d720f34b535cc1b917c53b3a', class: "top-0 font-bold sticky bg-white" }, h("tr", { key: '956677dd3a6a94a4fec8d9d784567aa3fdd62a16' }, ['model', 'variant', 'katashiki', 'modelYear', 'sfx'].map(title => (h("th", { key: title, class: "px-[10px] py-[20px] text-center whitespace-nowrap border-b border-[#d6d8dc]" }, texts[title]))))), h("tbody", { key: 'e62c17cb6047d082191913821426e6e1e928d9fc' }, h("tr", { key: '71a09174b51e10d070723c00b8db14499707bdc3' }, h("td", { key: '6fd71363e86b19311907a42348cee324e4137e43', class: "px-[10px] py-[20px] text-center whitespace-nowrap" }, ((_e = (_d = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.vehicleVariantInfo) === null || _e === void 0 ? void 0 : _e.modelCode) || '...', " ", h("br", { key: '759a2b9072f60aa917a001b39b91e38fc91e4b5a', class: "my-2" }), ((_g = (_f = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _f === void 0 ? void 0 : _f.vehicleSpecification) === null || _g === void 0 ? void 0 : _g.modelDesc) || '...'), h("td", { key: '3c634e53ec8955bcf1af66667a6fe004d6e46f01', class: "px-[10px] py-[20px] text-center whitespace-nowrap" }, ((_j = (_h = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _h === void 0 ? void 0 : _h.identifiers) === null || _j === void 0 ? void 0 : _j.variant) || '...', " ", h("br", { key: 'b81065d744067f06f60e6b34e31f219c6c58d373' }), ((_l = (_k = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _k === void 0 ? void 0 : _k.vehicleSpecification) === null || _l === void 0 ? void 0 : _l.variantDesc) || '...'), ['identifiers.katashiki', 'vehicleVariantInfo.modelYear', 'vehicleVariantInfo.sfx'].map(infoPath => {
781
833
  var _a;
782
834
  const [place, field] = infoPath.split('.');
783
835
  const cellValue = (_a = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _a === void 0 ? void 0 : _a[place][field].toString();
@@ -786,6 +838,7 @@ const VehicleSpecification = class {
786
838
  }
787
839
  get el() { return getElement(this); }
788
840
  static get watchers() { return {
841
+ "language": ["changeLanguage"],
789
842
  "state": ["loadingListener"]
790
843
  }; }
791
844
  };
@@ -798,47 +851,23 @@ function Loading({ isLoading }) {
798
851
  h("img", { class: "spin", src: loaderSvg })));
799
852
  }
800
853
 
801
- const checkSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj4KICAgIDxwYXRoIGZpbGw9IiMwYjM1MjEiCiAgICAgICAgZD0iTTI1NiA1MTJBMjU2IDI1NiAwIDEgMCAyNTYgMGEyNTYgMjU2IDAgMSAwIDAgNTEyek0zNjkgMjA5TDI0MSAzMzdjLTkuNCA5LjQtMjQuNiA5LjQtMzMuOSAwbC02NC02NGMtOS40LTkuNC05LjQtMjQuNiAwLTMzLjlzMjQuNi05LjQgMzMuOSAwbDQ3IDQ3TDMzNSAxNzVjOS40LTkuNCAyNC42LTkuNCAzMy45IDBzOS40IDI0LjYgMCAzMy45eiIgLz4KPC9zdmc+';
802
-
803
854
  const xMarkSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj4KICAgIDxwYXRoIGZpbGw9IiM1ODE1MWMiCiAgICAgICAgZD0iTTI1NiA1MTJBMjU2IDI1NiAwIDEgMCAyNTYgMGEyNTYgMjU2IDAgMSAwIDAgNTEyek0xNzUgMTc1YzkuNC05LjQgMjQuNi05LjQgMzMuOSAwbDQ3IDQ3IDQ3LTQ3YzkuNC05LjQgMjQuNi05LjQgMzMuOSAwczkuNCAyNC42IDAgMzMuOWwtNDcgNDcgNDcgNDdjOS40IDkuNCA5LjQgMjQuNiAwIDMzLjlzLTI0LjYgOS40LTMzLjkgMGwtNDctNDctNDcgNDdjLTkuNCA5LjQtMjQuNiA5LjQtMzMuOSAwcy05LjQtMjQuNiAwLTMzLjlsNDctNDctNDctNDdjLTkuNC05LjQtOS40LTI0LjYgMC0zMy45eiIgLz4KPC9zdmc+';
804
855
 
805
- function StatusCard({ desc, className, from, to, state = 'idle', icon = true }) {
806
- return (h("div", { class: cn('card', className, `${state}-card`) },
807
- icon && state === 'reject' && h("img", { src: xMarkSvg }),
808
- icon && state === 'warning' && h("img", { src: xMarkSvg }),
809
- icon && state === 'success' && h("img", { src: checkSvg }),
810
- from && (h("p", { class: "no-padding" },
811
- h("span", { class: "font-semibold pr-1" }, "From:"),
812
- " ",
813
- desc)),
814
- to && (h("p", { class: "no-padding" },
815
- h("span", { class: "font-semibold pr-1" }, "To:"),
816
- " ",
817
- desc)),
818
- !from && !to && h("p", { class: state === 'idle' ? 'no-padding' : '' }, desc)));
819
- }
820
-
821
- function CardsContainer({ warranty, isAuthorized, unInvoicedByBrokerName }) {
822
- return (h("div", { class: "warranty-tags mx-auto pt-3" },
823
- h(StatusCard, { state: isAuthorized ? 'success' : 'reject', desc: isAuthorized ? 'Authorized' : 'Unauthorized' }),
824
- h(StatusCard, { state: warranty.hasActiveWarranty ? 'success' : 'reject', desc: warranty.hasActiveWarranty ? 'Has Active Warranty' : "Doesn't Have Active Warranty" }),
825
- unInvoicedByBrokerName && h(StatusCard, { className: 'span-entire-2nd-row', state: 'warning', icon: true, desc: `Warranty is not Active because this Vehicle is not Invoiced by the following Trusted Business Partner: ${unInvoicedByBrokerName}` }),
826
- warranty.warrantyStartDate && h(StatusCard, { state: (warranty === null || warranty === void 0 ? void 0 : warranty.hasActiveWarranty) ? 'success' : 'reject', icon: false, from: true, desc: warranty.warrantyStartDate }),
827
- warranty.warrantyEndDate && h(StatusCard, { state: (warranty === null || warranty === void 0 ? void 0 : warranty.hasActiveWarranty) ? 'success' : 'reject', icon: false, to: true, desc: warranty.warrantyEndDate })));
828
- }
856
+ const checkSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj4KICAgIDxwYXRoIGZpbGw9IiMwYjM1MjEiCiAgICAgICAgZD0iTTI1NiA1MTJBMjU2IDI1NiAwIDEgMCAyNTYgMGEyNTYgMjU2IDAgMSAwIDAgNTEyek0zNjkgMjA5TDI0MSAzMzdjLTkuNCA5LjQtMjQuNiA5LjQtMzMuOSAwbC02NC02NGMtOS40LTkuNC05LjQtMjQuNiAwLTMzLjlzMjQuNi05LjQgMzMuOSAwbDQ3IDQ3TDMzNSAxNzVjOS40LTkuNCAyNC42LTkuNCAzMy45IDBzOS40IDI0LjYgMCAzMy45eiIgLz4KPC9zdmc+';
829
857
 
830
- function SSCTable({ ssc }) {
858
+ function SSCTable({ ssc, locale }) {
859
+ const warrantyLocale = locale.vehicleLookup.warranty;
831
860
  return (h("div", { class: "wrapper-table" },
832
- h("div", { class: "header" }, "SSC Campings"),
861
+ h("div", { class: "header" }, warrantyLocale.sscCampings),
833
862
  h("div", { class: "ssc-table-container" },
834
863
  h("table", { class: "ssc-table" },
835
864
  h("thead", null,
836
865
  h("tr", null,
837
- h("th", null, "Code"),
838
- h("th", null, "Description"),
839
- h("th", null, "Repair Status"),
840
- h("th", null, "OP-Codes"),
841
- h("th", null, "Part Number"))),
866
+ h("th", null, warrantyLocale.sscTableCode),
867
+ h("th", null, warrantyLocale.sscTableDescription),
868
+ h("th", null, warrantyLocale.sscTableRepairStatus),
869
+ h("th", null, warrantyLocale.sscTableOPCode),
870
+ h("th", null, warrantyLocale.sscTablePartNumber))),
842
871
  h("tbody", null, ssc.map(sscItem => (h("tr", { class: "transition", key: sscItem.sscCode },
843
872
  h("td", null, sscItem.sscCode),
844
873
  h("td", null, sscItem.description),
@@ -854,6 +883,36 @@ function SSCTable({ ssc }) {
854
883
  : '...'))))))))));
855
884
  }
856
885
 
886
+ function StatusCard({ desc, className, fromDesc, toDesc, from, to, state = 'idle', icon = true }) {
887
+ return (h("div", { class: cn('card', className, `${state}-card`) },
888
+ icon && state === 'reject' && h("img", { src: xMarkSvg }),
889
+ icon && state === 'warning' && h("img", { src: xMarkSvg }),
890
+ icon && state === 'success' && h("img", { src: checkSvg }),
891
+ from && (h("p", { class: "no-padding flex gap-2" },
892
+ h("span", { class: "font-semibold" },
893
+ fromDesc,
894
+ ":"),
895
+ " ",
896
+ desc)),
897
+ to && (h("p", { class: "no-padding flex gap-2" },
898
+ h("span", { class: "font-semibold" },
899
+ toDesc,
900
+ ":"),
901
+ " ",
902
+ desc)),
903
+ !from && !to && h("p", { class: state === 'idle' ? 'no-padding' : '' }, desc)));
904
+ }
905
+
906
+ function CardsContainer({ warranty, isAuthorized, unInvoicedByBrokerName, locale }) {
907
+ const warrantyLocale = locale.vehicleLookup.warranty;
908
+ return (h("div", { class: "warranty-tags mx-auto pt-3" },
909
+ h(StatusCard, { state: isAuthorized ? 'success' : 'reject', desc: isAuthorized ? warrantyLocale.authorized : warrantyLocale.unauthorized }),
910
+ h(StatusCard, { state: warranty.hasActiveWarranty ? 'success' : 'reject', desc: warranty.hasActiveWarranty ? warrantyLocale.activeWarranty : warrantyLocale.notActiveWarranty }),
911
+ unInvoicedByBrokerName && h(StatusCard, { className: "span-entire-2nd-row", state: "warning", icon: true, desc: warrantyLocale.notInvoiced + unInvoicedByBrokerName }),
912
+ warranty.warrantyStartDate && (h(StatusCard, { state: (warranty === null || warranty === void 0 ? void 0 : warranty.hasActiveWarranty) ? 'success' : 'reject', icon: false, from: true, fromDesc: warrantyLocale.from, desc: warranty.warrantyStartDate })),
913
+ warranty.warrantyEndDate && (h(StatusCard, { state: (warranty === null || warranty === void 0 ? void 0 : warranty.hasActiveWarranty) ? 'success' : 'reject', icon: false, to: true, toDesc: warrantyLocale.to, desc: warranty.warrantyEndDate }))));
914
+ }
915
+
857
916
  const warrantyDetailsCss = "*,: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}.collapse{visibility:collapse}.absolute{left:0;position:absolute;top:0}.relative{position:relative}.sticky{position:sticky}.mx-auto{margin-left:auto;margin-right:auto}.mt-4{margin-top:1rem}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-0{height:0!important;height:0}.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))}.flex-wrap{flex-wrap:wrap}.border{border-width:1px}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pr-1{padding-right:4px}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.font-semibold{font-weight:600}.transition{transition:all;transition-duration:.3s;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)}.duration-1000{transition-duration:1s}.duration-500{transition-duration:.5s}.duration-700{transition-duration:.7s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.success-card{background:#d0e7de;background-color:#d0e7de;border-color:#a2d0bb!important;border-color:#a2d0bb;color:#0b3521}.reject-card{background:#f7d7d8;background-color:#f7d7d8;border-color:#f2aeb5!important;border-color:#f2aeb5;color:#58151c}:host{all:initial!important;display:block}*{font-family:Arial}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .3s ease-in forwards;opacity:0}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-out{animation:fadeIn .3s ease-in forwards;opacity:1}.spin{animation:spin 2s linear infinite}.loading-spinner{align-items:center;display:flex;height:100%;justify-content:center;pointer-events:none;transition:all;transition-duration:.1s;width:100%}.loading-spinner img{height:40px;width:40px}.warranty{overflow:hidden;position:relative;transition:all;transition-duration:.3s}.hide{opacity:0}.card{border:1px solid;border-radius:6px;flex-shrink:0;gap:8px;padding:8px 12px}.card,.card p{align-items:center;display:flex}.card p{flex:1 1 0%;font-size:16px;height:25px;margin:0;padding-left:50px}.card p.no-padding{padding-left:4px}.card img{height:25px;width:25px}.recaptcha-response{border:1px solid;border-radius:8px;font-size:20px;margin:16px auto 0;padding:8px 16px;width:-moz-fit-content;width:fit-content}.warning-card{background:#fcf8e3;border-color:#faebcc!important;color:#8a6d3b}.span-entire-2nd-row{grid-column:1/3;grid-row:2/3}.warranty-tags{display:grid;gap:12px;grid-template-columns:1fr 1fr;max-width:1000px}.pt-3,.py-3{padding-top:12px}.pb-3,.py-3{padding-bottom:12px}.pt-4,.py-4{padding-top:16px}.pb-4,.py-4{padding-bottom:16px}.max-w-500{max-width:500px}.mt-4,.my-4{margin-bottom:16px;margin-top:16px}.warranty *{box-sizing:border-box}.wrapper-table{border:1px solid #d6d8dc;border-radius:4px;display:flex;flex-direction:column;margin-top:12px;max-height:70vh;overflow:hidden}.ssc-table-container{flex:1 1 0%;height:0;overflow:auto}.wrapper-table .header{align-items:center;background:#e1e3e5;color:#383c43;display:flex;flex-shrink:0;font-size:18px;height:40px;justify-content:center;width:100%}.ssc-table{border-collapse:collapse;overflow:auto;position:relative;width:100%}.ssc-table thead{background-color:#fff;font-weight:700;position:sticky;top:0}.ssc-table td,.ssc-table th{border-bottom:1px solid #d6d8dc;padding:10px 20px;text-align:center;transition:all;transition-duration:.3s;white-space:nowrap}.ssc-table tr:hover{background:#f4f4f4}.ssc-table tr:last-child td{border:none}.table-cell-container{align-items:center;display:flex;gap:8px;justify-content:center;width:100%}.table-cell-parts-container{flex-wrap:wrap}.table-cell-parts-container div{border-radius:4px;font-size:14px;padding:4px 8px}.table-cell-parts-container div.success{background:#d0e7de}.table-cell-parts-container div.reject{background:#f7d7d8}.table-status-icon{height:20px;width:20px}.warranty-vin{font-size:20px;padding-top:4px;text-align:center}.recaptcha-container{display:flex;justify-content:center;overflow:hidden}.static{position:static}.w-full{width:100%}.top-0{top:0}.my-2{margin-bottom:.5rem;margin-top:.5rem}.mt-\\[12px\\]{margin-top:12px}.table{display:table}.h-\\[40px\\]{height:40px}.h-\\[80px\\]{height:80px}.max-h-\\[70dvh\\]{max-height:70dvh}.min-h-\\[100px\\]{min-height:100px}.w-fit{width:fit-content}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.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))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded-\\[4px\\]{border-radius:4px}.rounded-\\[8px\\]{border-radius:8px}.border-b{border-bottom-width:1px}.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-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.px-\\[10px\\]{padding-left:10px;padding-right:10px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.py-4{padding-bottom:1rem;padding-top:1rem}.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}.text-\\[\\#383c43\\]{--tw-text-opacity:1;color:rgb(56 60 67/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.opacity-0{opacity:0}.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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}";
858
917
  const WarrantyDetailsStyle0 = warrantyDetailsCss;
859
918
 
@@ -862,13 +921,14 @@ const WarrantyDetails = class {
862
921
  constructor(hostRef) {
863
922
  registerInstance(this, hostRef);
864
923
  this.baseUrl = '';
865
- this.unauthorizedSscLookupBaseUrl = '';
866
924
  this.isDev = false;
867
925
  this.showSsc = false;
868
926
  this.queryString = '';
869
- this.unauthorizedSscLookupQueryString = '';
870
927
  this.recaptchaKey = '';
928
+ this.language = 'en';
871
929
  this.showWarranty = false;
930
+ this.unauthorizedSscLookupBaseUrl = '';
931
+ this.unauthorizedSscLookupQueryString = '';
872
932
  this.cityId = null;
873
933
  this.cityIntegrationId = null;
874
934
  this.companyId = null;
@@ -884,13 +944,20 @@ const WarrantyDetails = class {
884
944
  this.loadedResponse = undefined;
885
945
  this.state = 'idle';
886
946
  this.externalVin = null;
887
- this.errorMessage = null;
888
947
  this.showRecaptcha = false;
948
+ this.errorMessage = null;
889
949
  this.unInvoicedByBrokerName = null;
890
950
  this.vehicleInformation = undefined;
891
951
  this.checkingUnauthorizedSSC = false;
892
952
  this.recaptchaRes = null;
893
953
  this.headers = {};
954
+ this.locale = localeSchema.getDefault();
955
+ }
956
+ async componentWillLoad() {
957
+ await this.changeLanguage(this.language);
958
+ }
959
+ async changeLanguage(newLanguage) {
960
+ this.locale = await getLocaleLanguage(newLanguage);
894
961
  }
895
962
  handleSettingData(response) {
896
963
  var _a, _b, _c;
@@ -928,7 +995,7 @@ const WarrantyDetails = class {
928
995
  const hasPendingSSC = Math.random() < 0.5 ? false : true;
929
996
  this.recaptchaRes = {
930
997
  hasSSC: hasPendingSSC,
931
- message: hasPendingSSC ? 'This Vehicle has a Pending SSC' : 'No Pending SSC',
998
+ message: hasPendingSSC ? 'pendingSSC' : 'noPendingSSC',
932
999
  };
933
1000
  }
934
1001
  else {
@@ -945,11 +1012,11 @@ const WarrantyDetails = class {
945
1012
  const hasPendingSSC = vinResponse.sscLookupStatus === 1;
946
1013
  this.recaptchaRes = {
947
1014
  hasSSC: hasPendingSSC,
948
- message: hasPendingSSC ? 'This Vehicle has a Pending SSC' : 'No Pending SSC',
1015
+ message: hasPendingSSC ? 'pendingSSC' : 'noPendingSSC',
949
1016
  };
950
1017
  }
951
1018
  else
952
- throw new Error('Wrong response format');
1019
+ throw new Error('wrongResponseFormat');
953
1020
  }
954
1021
  }
955
1022
  }, 500);
@@ -988,7 +1055,7 @@ const WarrantyDetails = class {
988
1055
  const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData }, headers) : newData;
989
1056
  if (this.networkTimeoutRef === scopedTimeoutRef) {
990
1057
  if (!vehicleResponse)
991
- throw new Error('Wrong response format');
1058
+ throw new Error('wrongResponseFormat');
992
1059
  this.handleSettingData(vehicleResponse);
993
1060
  this.handleInitializingRecaptcha(vin, scopedTimeoutRef);
994
1061
  }
@@ -1025,10 +1092,11 @@ const WarrantyDetails = class {
1025
1092
  }
1026
1093
  render() {
1027
1094
  var _a, _b, _c, _d, _e;
1028
- return (h(Host, { key: '590b86e8c3fc8993794c24edabf8169c7e8105a4' }, h("div", { key: 'a3f2b266e72f75c6aecec054d0eef277a16807f7', class: "min-h-[100px] warranty" }, h("div", { key: 'a272392f3848b40df31b2f3ea47665e9d9b6fab6' }, h(Loading, { key: '9651e47db177da1e7097f037e63dcc208bee4ff6', isLoading: this.state.includes('loading') }), h("div", { key: 'f06b83e2903199b624780923a83ce3c005cc4e04', class: "transition duration-700", style: { transform: this.state.includes('loading') || this.state === 'idle' ? 'scale(0)' : 'scale(1)', opacity: this.state.includes('loading') ? '0' : '1' } }, (this.showSsc || this.showWarranty) && (h("div", { key: '09086f9a3e4d301fa2c0283de6c4a458a1f37bfa', style: { color: !!this.errorMessage ? 'red' : 'black' }, class: "warranty-vin" }, (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin)), ['error', 'error-loading'].includes(this.state) && (h("div", { key: 'd781b9b96fe9151fdc711127fd6e95eec3d2c27a', class: "py-4" }, h(StatusCard, { key: '2d5056b842c7c5276dd9068a9c15f7b4c3934271', desc: this.errorMessage, className: "mx-auto reject-card max-w-500" }), ' ')), this.showWarranty && ['data', 'data-loading'].includes(this.state) && (h(CardsContainer, { key: '3e3fe57c08277d0c4b113638f5c7b1c8bf67c1da', isAuthorized: (_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.isAuthorized, unInvoicedByBrokerName: this.unInvoicedByBrokerName, warranty: (_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.warranty })), h("div", { key: '45b368d2f868d6968bc378933dbcb43ed3f769b8', style: Object.assign({}, (this.showRecaptcha ? { height: 'auto', padding: '16px 16px 0px 16px' } : { height: '0px' })), class: "recaptcha-container" }, h("slot", { key: '18cc24a9b1432f305e3af6e08a166e4418d2074d' })), ['data', 'data-loading'].includes(this.state) && this.recaptchaRes && (h("div", { key: 'db95680aa9342d5c19413520d743ac27954601cc', class: cn('recaptcha-response', !this.recaptchaRes.hasSSC ? 'success-card' : 'reject-card ') }, this.recaptchaRes.message)), this.checkingUnauthorizedSSC && (h("div", { key: 'a2874a0311723a32f2c4ace8ac59e6eca21c068d', class: "loading-spinner", style: { marginTop: '20px', flexDirection: 'column' } }, h("div", { key: '5e8a3b3db4bed8820ba077c829ae1ba02acc69b1' }, h("strong", { key: '945a36e3f1c7a814924d36356699b22149693f1f' }, "Checking TMC")), h("img", { key: 'fe2abdbb699dc69083e439b56e336534d2b29e34', class: "spin", src: loaderSvg$1 }))), this.showSsc && ['data', 'data-loading'].includes(this.state) && ((_d = this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.ssc) !== null && !!((_e = this.vehicleInformation) === null || _e === void 0 ? void 0 : _e.ssc.length) && (h(SSCTable, { key: '2c536e2020a6bbf952e43f1f93df185c44b4ce2e', ssc: this.vehicleInformation.ssc })))))));
1095
+ return (h(Host, { key: '5976b28e5ddc465d0ae79b7882d40b4f7105ffdf' }, h("div", { key: '1c5623799b6fbfb7a343a78c6b96b027f4416d10', dir: this.locale.direction, class: "min-h-[100px] warranty" }, h("div", { key: '5dde3a2e0886f5ececd0e8d556abef41d167942d' }, h(Loading, { key: '7f8b0a8ed8b2f07fbbc2e7d5a5162ae7aca02a14', isLoading: this.state.includes('loading') }), h("div", { key: '240a44eefa85d905e3bf1900772524e4a660feca', class: "transition duration-700", style: { transform: this.state.includes('loading') || this.state === 'idle' ? 'scale(0)' : 'scale(1)', opacity: this.state.includes('loading') ? '0' : '1' } }, (this.showSsc || this.showWarranty) && (h("div", { key: '3d7488bbd306a360094636adc2732cf00aa4b877', style: { color: !!this.errorMessage ? 'red' : 'black' }, class: "warranty-vin" }, (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin)), ['error', 'error-loading'].includes(this.state) && (h("div", { key: '8f186a25db18cd00449ce68cf7261870b7996dc7', class: "py-4" }, h(StatusCard, { key: '5de5ac8872b809ef344440b6bc9fad956c744620', desc: this.locale.errors[this.errorMessage] || this.errorMessage, className: "mx-auto reject-card max-w-500" }), ' ')), this.showWarranty && ['data', 'data-loading'].includes(this.state) && (h(CardsContainer, { key: 'df36bf0f0e4906b662d11a3db6cf7cd40dabbae9', locale: this.locale, isAuthorized: (_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.isAuthorized, unInvoicedByBrokerName: this.unInvoicedByBrokerName, warranty: (_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.warranty })), h("div", { key: '00d93ce17bfc3868709d67a74fa80983e5e9d312', style: Object.assign({}, (this.showRecaptcha ? { height: 'auto', padding: '16px 16px 0px 16px' } : { height: '0px' })), class: "recaptcha-container" }, h("slot", { key: 'b3cb909a47adb872390d3afca1c6eefd167d1b01' })), ['data', 'data-loading'].includes(this.state) && this.recaptchaRes && (h("div", { key: '067dacd8f980da721272ffc03a15d6b5740580d9', class: cn('recaptcha-response', !this.recaptchaRes.hasSSC ? 'success-card' : 'reject-card ') }, this.locale.vehicleLookup.warranty[this.recaptchaRes.message])), this.checkingUnauthorizedSSC && (h("div", { key: '36564f7464cea7804439f58397b84d5554e19dd1', class: "loading-spinner", style: { marginTop: '20px', flexDirection: 'column' } }, h("div", { key: '92d1d9d3141f719a67e47e7187e65af814b93aa9' }, h("strong", { key: 'd93a6f157cd67de2fe8c93cf50c84aa6ba143a87' }, this.locale.vehicleLookup.warranty.checkingTMC)), h("img", { key: 'bb95bb4cc9f3d9dd5d1cf0a3f68f4af86a56b6d2', class: "spin", src: loaderSvg$1 }))), this.showSsc && ['data', 'data-loading'].includes(this.state) && ((_d = this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.ssc) !== null && !!((_e = this.vehicleInformation) === null || _e === void 0 ? void 0 : _e.ssc.length) && (h(SSCTable, { key: '02190f90bcf06693545848545013353e99baad12', locale: this.locale, ssc: this.vehicleInformation.ssc })))))));
1029
1096
  }
1030
1097
  get el() { return getElement(this); }
1031
1098
  static get watchers() { return {
1099
+ "language": ["changeLanguage"],
1032
1100
  "state": ["loadingListener"]
1033
1101
  }; }
1034
1102
  };