adp-web-components 0.0.90 → 0.0.92

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 (340) hide show
  1. package/dist/cjs/contact-us-form.cjs.entry.js +4 -4
  2. package/dist/cjs/dead-stock-lookup_3.cjs.entry.js +282 -325
  3. package/dist/cjs/empty-table-icon-PdTX6gpI.js +16 -0
  4. package/dist/cjs/flexible-container.cjs.entry.js +43 -46
  5. package/dist/cjs/form-dialog_8.cjs.entry.js +12 -12
  6. package/dist/cjs/{get-local-language-XsAJEAsO.js → get-local-language-Ch7javM0.js} +38 -38
  7. package/dist/cjs/information-table.cjs.entry.js +6 -3
  8. package/dist/cjs/loader.cjs.js +1 -1
  9. package/dist/cjs/loading-spinner.cjs.entry.js +1 -1
  10. package/dist/cjs/material-card-Cd0L1Get.js +43 -0
  11. package/dist/cjs/part-lookup.cjs.entry.js +32 -11
  12. package/dist/cjs/print-icon-C4ASnhAO.js +106 -0
  13. package/dist/cjs/service-booking-form.cjs.entry.js +4 -4
  14. package/dist/cjs/shift-components.cjs.js +1 -1
  15. package/dist/cjs/shift-tab-content.cjs.entry.js +42 -0
  16. package/dist/cjs/shift-tabs_2.cjs.entry.js +277 -234
  17. package/dist/cjs/{vehicle-info-layout-BSAeLW7e.js → type-BG4jir8r.js} +45 -9
  18. package/dist/cjs/{type-BAD2dFzP.js → type-BpPQE0Ww.js} +1 -1
  19. package/dist/cjs/{type-DT5vXP0E.js → type-DB__lcA9.js} +1 -1
  20. package/dist/cjs/vehicle-accessories_6.cjs.entry.js +1115 -0
  21. package/dist/cjs/vehicle-info-layout-Dp2Po_uc.js +16 -0
  22. package/dist/cjs/vehicle-lookup.cjs.entry.js +19 -16
  23. package/dist/cjs/vin-extractor.cjs.entry.js +3 -3
  24. package/dist/collection/components/components/flexible-container.css +1 -1
  25. package/dist/collection/components/components/flexible-container.js +34 -36
  26. package/dist/collection/components/components/information-table.css +1 -1
  27. package/dist/collection/components/components/information-table.js +45 -2
  28. package/dist/collection/components/components/loading-spinner.css +1 -1
  29. package/dist/collection/components/components/material-card.js +2 -2
  30. package/dist/collection/components/components/shift-tab-content.css +1 -1
  31. package/dist/collection/components/components/shift-tab-content.js +1 -1
  32. package/dist/collection/components/components/shift-tabs.css +1 -1
  33. package/dist/collection/components/form-elements/form-dialog.js +6 -6
  34. package/dist/collection/components/form-elements/form-input.js +4 -4
  35. package/dist/collection/components/form-elements/form-select.js +6 -6
  36. package/dist/collection/components/form-elements/form-structure-error.js +4 -4
  37. package/dist/collection/components/form-elements/form-structure.js +3 -3
  38. package/dist/collection/components/form-elements/form-submit.js +5 -5
  39. package/dist/collection/components/form-elements/form-text-area.js +4 -4
  40. package/dist/collection/components/forms/contact-us/element-mapper.js +1 -1
  41. package/dist/collection/components/forms/contact-us-form.js +4 -4
  42. package/dist/collection/components/forms/service-booking/element-mapper.js +1 -1
  43. package/dist/collection/components/forms/service-booking-form.js +4 -4
  44. package/dist/collection/components/part-lookup/components/dead-stock-item.js +15 -0
  45. package/dist/collection/components/part-lookup/dead-stock-lookup.css +1 -1
  46. package/dist/collection/components/part-lookup/dead-stock-lookup.js +153 -175
  47. package/dist/collection/components/part-lookup/distributor-lookup.css +1 -1
  48. package/dist/collection/components/part-lookup/distributor-lookup.js +192 -224
  49. package/dist/collection/components/part-lookup/manufacturer-lookup.css +1 -1
  50. package/dist/collection/components/part-lookup/manufacturer-lookup.js +165 -224
  51. package/dist/collection/components/part-lookup/part-lookup.css +1 -1
  52. package/dist/collection/components/part-lookup/part-lookup.js +127 -57
  53. package/dist/collection/components/vehicle-lookup/components/CardsContainer.js +1 -1
  54. package/dist/collection/components/vehicle-lookup/components/StatusCard.js +2 -2
  55. package/dist/collection/components/vehicle-lookup/components/claimable-item-popover.js +73 -0
  56. package/dist/collection/components/vehicle-lookup/components/claimable-item.js +27 -0
  57. package/dist/collection/components/vehicle-lookup/vehicle-accessories.css +1 -1
  58. package/dist/collection/components/vehicle-lookup/vehicle-accessories.js +108 -187
  59. package/dist/collection/components/vehicle-lookup/vehicle-claimable-items.css +1 -1
  60. package/dist/collection/components/vehicle-lookup/vehicle-claimable-items.js +369 -507
  61. package/dist/collection/components/vehicle-lookup/vehicle-item-claim-form.css +1 -1
  62. package/dist/collection/components/vehicle-lookup/vehicle-item-claim-form.js +271 -345
  63. package/dist/collection/components/vehicle-lookup/vehicle-lookup.css +1 -1
  64. package/dist/collection/components/vehicle-lookup/vehicle-lookup.js +59 -56
  65. package/dist/collection/components/vehicle-lookup/vehicle-paint-thickness.css +1 -1
  66. package/dist/collection/components/vehicle-lookup/vehicle-paint-thickness.js +106 -192
  67. package/dist/collection/components/vehicle-lookup/vehicle-service-history.css +1 -3
  68. package/dist/collection/components/vehicle-lookup/vehicle-service-history.js +106 -176
  69. package/dist/collection/components/vehicle-lookup/vehicle-specification.css +1 -3
  70. package/dist/collection/components/vehicle-lookup/vehicle-specification.js +104 -168
  71. package/dist/collection/components/vehicle-lookup/vehicle-warranty-details.css +1 -3
  72. package/dist/collection/components/vehicle-lookup/vehicle-warranty-details.js +198 -274
  73. package/dist/collection/components/vin-extractor/vin-extractor.js +13 -4
  74. package/dist/collection/{global/lib/image-expansion.js → features/image-viewer/image-viewer-logic.js} +15 -11
  75. package/dist/collection/features/image-viewer/image-viewer.js +9 -0
  76. package/dist/collection/features/image-viewer/index.js +7 -0
  77. package/dist/collection/features/image-viewer/interface.js +1 -0
  78. package/dist/collection/{global/lib → features/multi-lingual}/get-local-language.js +1 -5
  79. package/dist/collection/features/multi-lingual/index.js +7 -0
  80. package/dist/collection/features/multi-lingual/interface.js +1 -0
  81. package/dist/collection/{global/types/locale.js → features/multi-lingual/types.js} +6 -0
  82. package/dist/collection/features/part-lookup-components/index.js +7 -0
  83. package/dist/collection/features/part-lookup-components/interface.js +1 -0
  84. package/dist/collection/features/part-lookup-components/part-lookup-api-integration.js +84 -0
  85. package/dist/collection/features/part-lookup-components/types.js +1 -0
  86. package/dist/collection/features/vehicle-info-layout/index.js +6 -0
  87. package/dist/collection/features/vehicle-info-layout/interface.js +1 -0
  88. package/dist/collection/{components/components → features/vehicle-info-layout}/vehicle-info-layout.js +1 -1
  89. package/dist/collection/features/vehicle-lookup-component/index.js +7 -0
  90. package/dist/collection/features/vehicle-lookup-component/interface.js +1 -0
  91. package/dist/collection/features/vehicle-lookup-component/types.js +17 -0
  92. package/dist/collection/features/vehicle-lookup-component/vehicle-lookup-api-integration.js +87 -0
  93. package/dist/collection/global/assets/activation-icon.js +6 -0
  94. package/dist/collection/global/assets/add-icon.js +6 -0
  95. package/dist/collection/global/assets/alert-icon.js +6 -0
  96. package/dist/collection/global/assets/arrow-up-icon.js +6 -0
  97. package/dist/collection/global/assets/attach-icon.js +6 -0
  98. package/dist/collection/global/assets/check-icon.js +6 -0
  99. package/dist/collection/global/assets/empty-table-icon.js +6 -0
  100. package/dist/collection/global/assets/form-submit-svg.js +6 -0
  101. package/dist/collection/global/assets/print-icon.js +6 -0
  102. package/dist/collection/global/assets/question-mark.js +6 -0
  103. package/dist/collection/global/assets/triangle-icon.js +6 -0
  104. package/dist/collection/global/lib/parents-with-tag.js +22 -0
  105. package/dist/collection/global/types/generated/vehicle-lookup/vehicle-item-warning.js +1 -0
  106. package/dist/collection/locales/vehicleLookup/claimableItems/type.js +4 -6
  107. package/dist/collection/templates/part-lookup/mock-data.js +85 -2
  108. package/dist/collection/templates/vehicle-lookup/mock-data.js +39 -0
  109. package/dist/components/contact-us-form.js +1 -1
  110. package/dist/components/dead-stock-lookup.js +1 -1
  111. package/dist/components/distributor-lookup.js +1 -1
  112. package/dist/components/flexible-container.js +1 -1
  113. package/dist/components/form-dialog.js +1 -1
  114. package/dist/components/form-input.js +1 -1
  115. package/dist/components/form-select.js +1 -1
  116. package/dist/components/form-structure-error.js +1 -1
  117. package/dist/components/form-structure.js +1 -1
  118. package/dist/components/form-submit.js +1 -1
  119. package/dist/components/form-text-area.js +1 -1
  120. package/dist/components/information-table.js +1 -1
  121. package/dist/components/loading-spinner.js +1 -1
  122. package/dist/components/manufacturer-lookup.js +1 -1
  123. package/dist/components/p-4O0gfpsm.js +5 -0
  124. package/dist/components/p-8hUwcL5D.js +5 -0
  125. package/dist/components/p-9BQXTBdQ.js +5 -0
  126. package/dist/components/p-B1fdQNyr.js +5 -0
  127. package/dist/components/p-B2EAhWbD.js +5 -0
  128. package/dist/components/p-B9RSECb0.js +5 -0
  129. package/dist/components/p-BDCoLRVe.js +5 -0
  130. package/dist/components/p-BG8YXzND.js +5 -0
  131. package/dist/components/p-BNhO80aE.js +5 -0
  132. package/dist/components/p-Be1vlY8X.js +5 -0
  133. package/dist/components/p-BhjL0HMA.js +5 -0
  134. package/dist/components/p-C4zpDhOi.js +5 -0
  135. package/dist/components/p-CHE0gMDU.js +5 -0
  136. package/dist/components/p-CMweaUDZ.js +5 -0
  137. package/dist/components/p-COU68JDH.js +5 -0
  138. package/dist/components/p-Ce4X3l8Z.js +5 -0
  139. package/dist/components/p-CeUz_77J.js +5 -0
  140. package/dist/components/{p-D7yku_Qi.js → p-CgRbul8P.js} +1 -1
  141. package/dist/components/{p-JtBlsz4j.js → p-CiosiH6q.js} +1 -1
  142. package/dist/components/p-CnCnKZ25.js +5 -0
  143. package/dist/components/{p-C-4kx8qU.js → p-CqvK2B_Z.js} +1 -1
  144. package/dist/components/{p-B6QhQCZi.js → p-D6AC01Wg.js} +1 -1
  145. package/dist/components/p-DOoqf10k.js +5 -0
  146. package/dist/components/{p-BaJpYztb.js → p-DRdEUWsa.js} +1 -1
  147. package/dist/components/p-DSNyMvnc.js +5 -0
  148. package/dist/components/{p-CjWDXQ_q.js → p-DhxirzfQ.js} +1 -1
  149. package/dist/components/p-DiG3vhi6.js +5 -0
  150. package/dist/{shift-components/p-CIU9c3pi.js → components/p-DnMCq3Mw.js} +1 -1
  151. package/dist/components/p-Dt-24vpn.js +5 -0
  152. package/dist/components/p-DxBcoZIg.js +5 -0
  153. package/dist/components/{p-D63WC2_Y.js → p-pYVYeitk.js} +1 -1
  154. package/dist/components/p-piZ41_ho.js +5 -0
  155. package/dist/components/part-lookup.js +1 -1
  156. package/dist/components/service-booking-form.js +1 -1
  157. package/dist/components/shift-accordion.js +1 -1
  158. package/dist/components/shift-slider.js +1 -1
  159. package/dist/components/shift-tab-content.js +1 -1
  160. package/dist/components/shift-tabs.js +1 -1
  161. package/dist/components/vehicle-accessories.js +1 -1
  162. package/dist/components/vehicle-claimable-items.js +1 -1
  163. package/dist/components/vehicle-item-claim-form.js +1 -1
  164. package/dist/components/vehicle-lookup.js +1 -1
  165. package/dist/components/vehicle-paint-thickness.js +1 -1
  166. package/dist/components/vehicle-service-history.js +1 -1
  167. package/dist/components/vehicle-specification.js +1 -1
  168. package/dist/components/vehicle-warranty-details.js +1 -1
  169. package/dist/components/vin-extractor.js +1 -1
  170. package/dist/esm/contact-us-form.entry.js +4 -4
  171. package/dist/esm/dead-stock-lookup_3.entry.js +283 -326
  172. package/dist/esm/empty-table-icon-DvQk12N9.js +14 -0
  173. package/dist/esm/flexible-container.entry.js +43 -46
  174. package/dist/esm/form-dialog_8.entry.js +12 -12
  175. package/dist/esm/{get-local-language-BPo-xYwK.js → get-local-language-KsoLM3LI.js} +38 -38
  176. package/dist/esm/information-table.entry.js +6 -3
  177. package/dist/esm/loader.js +1 -1
  178. package/dist/esm/loading-spinner.entry.js +1 -1
  179. package/dist/esm/material-card-DiAl-884.js +40 -0
  180. package/dist/esm/part-lookup.entry.js +32 -11
  181. package/dist/esm/print-icon-Dn5kQmLo.js +99 -0
  182. package/dist/esm/service-booking-form.entry.js +4 -4
  183. package/dist/esm/shift-components.js +1 -1
  184. package/dist/esm/shift-tab-content.entry.js +40 -0
  185. package/dist/esm/shift-tabs_2.entry.js +277 -234
  186. package/dist/esm/type-BAXhU7Vq.js +79 -0
  187. package/dist/esm/{type-DHujxJVp.js → type-CAfIkrCW.js} +1 -1
  188. package/dist/esm/{type-D9Rd8Kcd.js → type-CoXoa4w8.js} +1 -1
  189. package/dist/esm/vehicle-accessories_6.entry.js +1108 -0
  190. package/dist/esm/vehicle-info-layout-CNGGKAia.js +14 -0
  191. package/dist/esm/vehicle-lookup.entry.js +14 -11
  192. package/dist/esm/vin-extractor.entry.js +3 -3
  193. package/dist/locales/vehicleLookup/claimableItems/ar.json +5 -6
  194. package/dist/locales/vehicleLookup/claimableItems/en.json +5 -6
  195. package/dist/locales/vehicleLookup/claimableItems/ku.json +5 -6
  196. package/dist/locales/vehicleLookup/claimableItems/ru.json +5 -6
  197. package/dist/locales/vehicleLookup/claimableItems/type.ts +4 -6
  198. package/dist/shift-components/p-03f093e0.entry.js +5 -0
  199. package/dist/shift-components/p-277c8a5b.entry.js +5 -0
  200. package/dist/shift-components/p-42218765.entry.js +5 -0
  201. package/dist/shift-components/p-55c5a5ea.entry.js +5 -0
  202. package/dist/shift-components/p-5906834e.entry.js +5 -0
  203. package/dist/shift-components/p-5bd460db.entry.js +5 -0
  204. package/dist/shift-components/p-701e3fb0.entry.js +5 -0
  205. package/dist/shift-components/p-98cb9ff7.entry.js +5 -0
  206. package/dist/{components/p-CK4E5G0i.js → shift-components/p-BBKhY55u.js} +1 -1
  207. package/dist/shift-components/{p-DHb8KxaG.js → p-BGyVhGdx.js} +1 -1
  208. package/dist/shift-components/p-BSpTbUWi.js +5 -0
  209. package/dist/shift-components/p-BnTnweSV.js +5 -0
  210. package/dist/shift-components/{p-CuQ84qxe.js → p-D7OEt6rC.js} +1 -1
  211. package/dist/shift-components/p-DzSZ47FV.js +5 -0
  212. package/dist/shift-components/p-Wtw8qj6x.js +5 -0
  213. package/dist/shift-components/p-a137e4bb.entry.js +5 -0
  214. package/dist/shift-components/{p-f282c740.entry.js → p-c4c88519.entry.js} +1 -1
  215. package/dist/shift-components/{p-b6497f63.entry.js → p-dee5dd04.entry.js} +1 -1
  216. package/dist/shift-components/p-e428aabb.entry.js +5 -0
  217. package/dist/shift-components/p-ff79b92b.entry.js +5 -0
  218. package/dist/shift-components/p-fyqwD4fB.js +5 -0
  219. package/dist/shift-components/shift-components.esm.js +1 -1
  220. package/dist/types/components/components/flexible-container.d.ts +2 -5
  221. package/dist/types/components/components/information-table.d.ts +2 -0
  222. package/dist/types/components/components/material-card.d.ts +1 -1
  223. package/dist/types/components/form-elements/form-dialog.d.ts +1 -2
  224. package/dist/types/components/form-elements/form-input.d.ts +1 -2
  225. package/dist/types/components/form-elements/form-select.d.ts +1 -2
  226. package/dist/types/components/form-elements/form-structure-error.d.ts +1 -2
  227. package/dist/types/components/form-elements/form-structure.d.ts +2 -3
  228. package/dist/types/components/form-elements/form-submit.d.ts +1 -1
  229. package/dist/types/components/form-elements/form-text-area.d.ts +1 -1
  230. package/dist/types/components/forms/contact-us-form.d.ts +1 -1
  231. package/dist/types/components/forms/service-booking-form.d.ts +1 -1
  232. package/dist/types/components/part-lookup/components/dead-stock-item.d.ts +14 -0
  233. package/dist/types/components/part-lookup/dead-stock-lookup.d.ts +25 -23
  234. package/dist/types/components/part-lookup/distributor-lookup.d.ts +23 -24
  235. package/dist/types/components/part-lookup/manufacturer-lookup.d.ts +23 -25
  236. package/dist/types/components/part-lookup/part-lookup.d.ts +17 -12
  237. package/dist/types/components/vehicle-lookup/components/claimable-item-popover.d.ts +17 -0
  238. package/dist/types/components/vehicle-lookup/components/claimable-item.d.ts +12 -0
  239. package/dist/types/components/vehicle-lookup/vehicle-accessories.d.ts +23 -28
  240. package/dist/types/components/vehicle-lookup/vehicle-claimable-items.d.ts +53 -55
  241. package/dist/types/components/vehicle-lookup/vehicle-item-claim-form.d.ts +39 -55
  242. package/dist/types/components/vehicle-lookup/vehicle-lookup.d.ts +8 -9
  243. package/dist/types/components/vehicle-lookup/vehicle-paint-thickness.d.ts +23 -29
  244. package/dist/types/components/vehicle-lookup/vehicle-service-history.d.ts +20 -23
  245. package/dist/types/components/vehicle-lookup/vehicle-specification.d.ts +20 -22
  246. package/dist/types/components/vehicle-lookup/vehicle-warranty-details.d.ts +27 -31
  247. package/dist/types/components/vin-extractor/vin-extractor.d.ts +2 -2
  248. package/dist/types/components.d.ts +143 -169
  249. package/dist/types/features/image-viewer/image-viewer-logic.d.ts +3 -0
  250. package/dist/types/features/image-viewer/image-viewer.d.ts +10 -0
  251. package/dist/types/features/image-viewer/index.d.ts +3 -0
  252. package/dist/types/features/image-viewer/interface.d.ts +5 -0
  253. package/dist/types/features/multi-lingual/get-local-language.d.ts +4 -0
  254. package/dist/types/features/multi-lingual/index.d.ts +3 -0
  255. package/dist/types/features/multi-lingual/interface.d.ts +8 -0
  256. package/dist/types/{global/lib/get-local-language.d.ts → features/multi-lingual/types.d.ts} +17 -6
  257. package/dist/types/features/part-lookup-components/index.d.ts +3 -0
  258. package/dist/types/features/part-lookup-components/interface.d.ts +25 -0
  259. package/dist/types/features/part-lookup-components/part-lookup-api-integration.d.ts +14 -0
  260. package/dist/types/features/part-lookup-components/types.d.ts +3 -0
  261. package/dist/types/features/vehicle-info-layout/index.d.ts +2 -0
  262. package/dist/types/features/vehicle-info-layout/interface.d.ts +3 -0
  263. package/dist/types/{components/components → features/vehicle-info-layout}/vehicle-info-layout.d.ts +3 -3
  264. package/dist/types/features/vehicle-lookup-component/index.d.ts +3 -0
  265. package/dist/types/features/vehicle-lookup-component/interface.d.ts +24 -0
  266. package/dist/types/features/vehicle-lookup-component/types.d.ts +17 -0
  267. package/dist/types/features/vehicle-lookup-component/vehicle-lookup-api-integration.d.ts +15 -0
  268. package/dist/types/global/assets/activation-icon.d.ts +6 -0
  269. package/dist/types/global/assets/add-icon.d.ts +6 -0
  270. package/dist/types/global/assets/alert-icon.d.ts +6 -0
  271. package/dist/types/global/assets/arrow-up-icon.d.ts +6 -0
  272. package/dist/types/global/assets/attach-icon.d.ts +6 -0
  273. package/dist/types/global/assets/check-icon.d.ts +6 -0
  274. package/dist/types/global/assets/empty-table-icon.d.ts +6 -0
  275. package/dist/types/global/assets/form-submit-svg.d.ts +6 -0
  276. package/dist/types/global/assets/print-icon.d.ts +6 -0
  277. package/dist/types/global/assets/question-mark.d.ts +6 -0
  278. package/dist/types/global/assets/triangle-icon.d.ts +6 -0
  279. package/dist/types/global/lib/parents-with-tag.d.ts +1 -0
  280. package/dist/types/global/lib/recaptcha.d.ts +1 -1
  281. package/dist/types/global/types/components.d.ts +0 -1
  282. package/dist/types/global/types/forms.d.ts +1 -1
  283. package/dist/types/global/types/generated/vehicle-lookup/vehicle-item-warning.d.ts +7 -0
  284. package/dist/types/global/types/generated/vehicle-lookup/vehicle-service-item-dto.d.ts +3 -0
  285. package/dist/types/locales/vehicleLookup/accessories/type.d.ts +2 -2
  286. package/dist/types/locales/vehicleLookup/claimableItems/type.d.ts +18 -26
  287. package/dist/types/locales/vehicleLookup/warranty/type.d.ts +2 -2
  288. package/dist/types/locales/vehicleLookup/wrapper-type.d.ts +14 -18
  289. package/package.json +1 -2
  290. package/dist/cjs/shift-tab-content_7.cjs.entry.js +0 -1487
  291. package/dist/cjs/type-CCsnwaKp.js +0 -56
  292. package/dist/collection/global/api/partInformation.js +0 -32
  293. package/dist/collection/global/api/vehicleInformation.js +0 -48
  294. package/dist/components/p-1vy-Ba6r.js +0 -5
  295. package/dist/components/p-B5YdqGVm.js +0 -5
  296. package/dist/components/p-BDkK65_1.js +0 -5
  297. package/dist/components/p-BT4rhLRL.js +0 -5
  298. package/dist/components/p-C1F_f1WE.js +0 -5
  299. package/dist/components/p-CACnUI7c.js +0 -5
  300. package/dist/components/p-CDOvd2iD.js +0 -5
  301. package/dist/components/p-CGzOJT7g.js +0 -5
  302. package/dist/components/p-CINfIgzX.js +0 -5
  303. package/dist/components/p-CJpwqpuQ.js +0 -5
  304. package/dist/components/p-CUqXnLyM.js +0 -5
  305. package/dist/components/p-Cl9ct-bZ.js +0 -5
  306. package/dist/components/p-CqGVdvFp.js +0 -5
  307. package/dist/components/p-D2bxjSGr.js +0 -5
  308. package/dist/components/p-DXHx6lre.js +0 -5
  309. package/dist/components/p-DXj5zsQK.js +0 -5
  310. package/dist/components/p-DsCtgcZn.js +0 -5
  311. package/dist/components/p-DxjQlmaz.js +0 -5
  312. package/dist/components/p-nxlqujKv.js +0 -5
  313. package/dist/components/p-vvHN2Olh.js +0 -5
  314. package/dist/components/p-yQ70lKV2.js +0 -5
  315. package/dist/esm/shift-tab-content_7.entry.js +0 -1479
  316. package/dist/esm/type-CfLRnI1J.js +0 -53
  317. package/dist/esm/vehicle-info-layout-D1bvY1nt.js +0 -43
  318. package/dist/shift-components/p-389f444c.entry.js +0 -5
  319. package/dist/shift-components/p-5dd208de.entry.js +0 -5
  320. package/dist/shift-components/p-5f91eb5f.entry.js +0 -5
  321. package/dist/shift-components/p-76dd44e9.entry.js +0 -5
  322. package/dist/shift-components/p-9a51dae0.entry.js +0 -5
  323. package/dist/shift-components/p-BAMA88Mr.js +0 -5
  324. package/dist/shift-components/p-Br0JD1CD.js +0 -5
  325. package/dist/shift-components/p-af44ca99.entry.js +0 -5
  326. package/dist/shift-components/p-d0e6cd78.entry.js +0 -5
  327. package/dist/shift-components/p-f1225504.entry.js +0 -5
  328. package/dist/shift-components/p-faabbd23.entry.js +0 -5
  329. package/dist/shift-components/p-ff0fec09.entry.js +0 -5
  330. package/dist/types/global/api/partInformation.d.ts +0 -19
  331. package/dist/types/global/api/vehicleInformation.d.ts +0 -33
  332. package/dist/types/global/lib/image-expansion.d.ts +0 -9
  333. package/dist/types/global/types/locale.d.ts +0 -11
  334. /package/dist/collection/{components/vehicle-lookup → global}/assets/activationRequired.svg +0 -0
  335. /package/dist/collection/{components/vehicle-lookup → global}/assets/cancelled.svg +0 -0
  336. /package/dist/collection/{components/vehicle-lookup → global}/assets/check.svg +0 -0
  337. /package/dist/collection/{components/vehicle-lookup → global}/assets/expired.svg +0 -0
  338. /package/dist/collection/{components/vehicle-lookup → global}/assets/pending.svg +0 -0
  339. /package/dist/collection/{components/vehicle-lookup → global}/assets/processed.svg +0 -0
  340. /package/dist/collection/{components/vehicle-lookup → global}/assets/x-mark.svg +0 -0
@@ -1,1479 +0,0 @@
1
- /*!
2
- * Built by ShiftSoftware
3
- * Copyright (c)
4
- */
5
- import { r as registerInstance, h, H as Host, a as getElement } from './index-CikEOqe0.js';
6
- import { c as cn } from './cn-BK16Cn81.js';
7
- import { s as sharedLocalesSchema, g as getLocaleLanguage, a as getSharedLocal } from './get-local-language-BPo-xYwK.js';
8
- import { a as accessoriesSchema, V as VehicleInfoLayout, p as paintThicknessSchema, S as ServiceHistorySchema, s as specificationSchema, w as warrantySchema } from './vehicle-info-layout-D1bvY1nt.js';
9
- import { c as claimableItemsSchema } from './type-CfLRnI1J.js';
10
-
11
- const shiftTabContentCss = "*,: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}.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))}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.slide-content-in{animation:slideContentIn .35s ease-out forwards}@keyframes slideContentIn{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.slide-content-out{animation:slideContentOut .35s ease-out forwards}@keyframes slideContentOut{0%{opacity:1;transform:translateY(0)}99%{opacity:0;transform:translateY(-50px)}to{opacity:0;transform:translateY(-200%) translateX(-200%)}}.static{position:static}.flex{display:flex}.h-\\[200px\\]{height:200px}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.z-40{z-index:40}.float-right{float:right}.mx-auto{margin-left:auto;margin-right:auto}.mr-\\[16px\\]{margin-right:16px}.mt-\\[16px\\]{margin-top:16px}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-\\[84px\\]{width:84px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.shrink-0{flex-shrink:0}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.text-center{text-align:center}.font-semibold{font-weight:600}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.delay-200{transition-delay:.2s}.duration-300{transition-duration:.3s}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.hidden{display:none}.grow{flex-grow:1}.items-stretch{align-items:stretch}.overflow-auto{overflow:auto}.p-\\[16px\\]{padding:16px}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.mt-\\[32px\\]{margin-top:32px}.h-\\[25px\\]{height:25px}.h-\\[50px\\]{height:50px}.h-\\[8px\\]{height:8px}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.pt-\\[16px\\]{padding-top:16px}.pt-\\[40px\\]{padding-top:40px}.text-\\[18px\\]{font-size:18px}.font-bold{font-weight:700}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}.\\!pointer-events-none{pointer-events:none!important}.\\!w-full{width:100%!important}.translate-x-\\[-200\\%\\]{--tw-translate-x:-200%}.translate-x-\\[-200\\%\\],.translate-y-\\[200\\%\\]{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))}.translate-y-\\[200\\%\\]{--tw-translate-y:200%}.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)}.\\!duration-0{transition-duration:0s!important}.\\[\\&_\\*\\]\\:\\!pointer-events-none *{pointer-events:none!important}";
12
-
13
- const ShiftTabContent = class {
14
- constructor(hostRef) {
15
- registerInstance(this, hostRef);
16
- this.clearAnimationClasses = (elementName) => {
17
- const element = this.el.getElementsByClassName(`tab-${elementName}`)[0];
18
- element.classList.remove('slide-content-out');
19
- element.classList.remove('slide-content-in');
20
- return element;
21
- };
22
- }
23
- async onActiveIndexChange(newActiveComponent, oldActiveComponent) {
24
- this.lastActiveComponent = oldActiveComponent;
25
- clearTimeout(this.ChildUpdatesActionTimeout);
26
- const oldElement = this.clearAnimationClasses(oldActiveComponent);
27
- const newElement = this.clearAnimationClasses(newActiveComponent);
28
- oldElement.classList.add('slide-content-out');
29
- newElement.classList.add('slide-content-in');
30
- }
31
- render() {
32
- return (h(Host, { key: 'e6a02d2b036de2cb88b4bde00ac815a8dc1e546b' }, h("flexible-container", { key: '180186694b6c854dbfe11458c039bb64f8d3b34e', classes: "relative" }, Object.entries(this.components).map(([componentName, component]) => (h("div", { onAnimationEnd: () => this.clearAnimationClasses(componentName), class: cn('!w-full transition !duration-0', `tab-${componentName}`, {
33
- 'absolute opacity-0 top-0 !pointer-events-none [&_*]:!pointer-events-none translate-x-[-200%] translate-y-[200%]': componentName !== this.activeComponent,
34
- }) }, component))))));
35
- }
36
- get el() { return getElement(this); }
37
- static get watchers() { return {
38
- "activeComponent": ["onActiveIndexChange"]
39
- }; }
40
- };
41
- ShiftTabContent.style = shiftTabContentCss;
42
-
43
- const vehicleRequestHeaders = {
44
- cityId: 'City-Id',
45
- userId: 'User-Id',
46
- companyId: 'Company-Id',
47
- customerName: 'Customer-Name',
48
- customerPhone: 'Customer-Phone',
49
- customerEmail: 'Customer-Email',
50
- companyBranchId: 'Company-Branch-Id',
51
- cityIntegrationId: 'City-Integration-Id',
52
- brandIntegrationId: 'Brand-Integration-Id',
53
- companyIntegrationId: 'Company-Integration-Id',
54
- companyBranchIntegrationId: 'Company-Branch-Integration-Id',
55
- };
56
- const getVehicleInformation = async (component, generalProps, headers = {}) => {
57
- const { notAvailableMessage, mockData, vin, scopedTimeoutRef, middlewareCallback } = generalProps;
58
- const { isDev, baseUrl, queryString, abortController, networkTimeoutRef, loadedResponse } = component;
59
- const handleResult = (newVehicleInformation) => {
60
- if (networkTimeoutRef === scopedTimeoutRef) {
61
- if (!newVehicleInformation && vin)
62
- throw new Error(notAvailableMessage || 'wrongResponseFormat');
63
- if (loadedResponse)
64
- loadedResponse(newVehicleInformation);
65
- if (middlewareCallback)
66
- middlewareCallback(newVehicleInformation);
67
- return newVehicleInformation;
68
- }
69
- };
70
- if (isDev) {
71
- const newData = mockData[vin];
72
- return handleResult(newData);
73
- }
74
- else {
75
- if (!baseUrl)
76
- throw new Error('noBaseUrl');
77
- const componentHeaders = Object.assign({}, headers);
78
- Object.entries(vehicleRequestHeaders).forEach(([componentHeaderKey, headerField]) => {
79
- if (component[componentHeaderKey])
80
- componentHeaders[headerField] = component[componentHeaderKey];
81
- });
82
- const response = await fetch(`${baseUrl}${vin}?${queryString}`, { signal: abortController.signal, headers: componentHeaders });
83
- const newData = (await response.json());
84
- return handleResult(newData);
85
- }
86
- };
87
-
88
- function openImageViewer(context, target, imageSrc) {
89
- if (context.expandedImage === imageSrc)
90
- return;
91
- context.originalImage = target;
92
- const expandedImageRef = context.el.shadowRoot.getElementById('expanded-image');
93
- expandedImageRef.src = target.src;
94
- document.addEventListener('keydown', context.closeImageListener);
95
- const rect = target.getBoundingClientRect();
96
- document.body.style.overflow = 'hidden';
97
- Object.assign(expandedImageRef.style, {
98
- top: `${rect.top}px`,
99
- pointerEvents: 'auto',
100
- left: `${rect.left}px`,
101
- transitionDuration: '0s',
102
- width: `${rect.width}px`,
103
- height: `${rect.height}px`,
104
- });
105
- setTimeout(() => {
106
- const naturalWidth = target.naturalWidth;
107
- const naturalHeight = target.naturalHeight;
108
- const maxWidth = window.innerWidth - 160;
109
- const maxHeight = window.innerHeight - 32;
110
- const aspectRatio = naturalWidth / naturalHeight;
111
- let width, height;
112
- if (maxWidth / aspectRatio <= maxHeight) {
113
- width = maxWidth;
114
- height = maxWidth / aspectRatio;
115
- }
116
- else {
117
- height = maxHeight;
118
- width = maxHeight * aspectRatio;
119
- }
120
- expandedImageRef.style.transitionDuration = '0.3s';
121
- Object.assign(expandedImageRef.style, {
122
- opacity: '1',
123
- width: `${width}px`,
124
- height: `${height}px`,
125
- top: `${(window.innerHeight - height) / 2}px`,
126
- left: `${(window.innerWidth - width) / 2}px`,
127
- });
128
- context.expandedImage = imageSrc;
129
- }, 200);
130
- }
131
- function closeImageViewer(context, event) {
132
- if (event && event.key !== 'Escape')
133
- return;
134
- document.removeEventListener('keydown', context.closeImageListener);
135
- const expandedImageRef = context.el.shadowRoot.getElementById('expanded-image');
136
- const rect = context.originalImage.getBoundingClientRect();
137
- Object.assign(expandedImageRef.style, {
138
- top: `${rect.top}px`,
139
- pointerEvents: 'none',
140
- left: `${rect.left}px`,
141
- width: `${rect.width}px`,
142
- height: `${rect.height}px`,
143
- transitionDuration: '0.3s',
144
- });
145
- setTimeout(() => {
146
- expandedImageRef.src = '';
147
- expandedImageRef.style.opacity = '0';
148
- expandedImageRef.style.transitionDuration = '0s';
149
- }, 300);
150
- document.body.style.overflow = '';
151
- context.expandedImage = null;
152
- }
153
-
154
- const eyeSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIgogICAgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWV5ZSI+CiAgICA8cGF0aCBkPSJNMi4wNjIgMTIuMzQ4YTEgMSAwIDAgMSAwLS42OTYgMTAuNzUgMTAuNzUgMCAwIDEgMTkuODc2IDAgMSAxIDAgMCAxIDAgLjY5NiAxMC43NSAxMC43NSAwIDAgMS0xOS44NzYgMCIgLz4KICAgIDxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjMiIC8+Cjwvc3ZnPg==';
155
-
156
- const vehicleAccessoriesCss = "@tailwind base;@tailwind utilities;@tailwind components;*,: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}.invisible{visibility:hidden}.absolute{position:absolute}.\\!relative{position:relative!important}.relative{position:relative}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.block{display:block}.flex{display:flex}.h-\\[54px\\]{height:54px}.origin-left{transform-origin:left}.scale-\\[1\\.5\\]{--tw-scale-x:1.5;--tw-scale-y:1.5;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-hidden{overflow:hidden!important}.overflow-hidden{overflow:hidden}.\\!rounded-\\[4px\\]{border-radius:4px!important}.rounded-\\[5px\\]{border-radius:5px}.border{border-width:1px}.border-\\[\\#dcdcdc\\]{--tw-border-opacity:1;border-color:rgb(220 220 220/var(--tw-border-opacity,1))}.border-\\[\\#ededed\\]{--tw-border-opacity:1;border-color:rgb(237 237 237/var(--tw-border-opacity,1))}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.bg-\\[\\#fdfdfd\\]{--tw-bg-opacity:1;background-color:rgb(253 253 253/var(--tw-bg-opacity,1))}.p-0{padding:0}.text-center{text-align:center}.text-\\[16px\\]{font-size:16px}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow-\\[inset_0_1px_3px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.05\\)\\2c 0_1px_0_rgba\\(255\\2c 255\\2c 255\\2c 0\\.1\\)\\]{--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 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{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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-\\[0\\.4s\\]{transition-duration:.4s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-container{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 var(--tw-shadow-color);background-color:rgb(253 253 253/var(--tw-bg-opacity,1));border-color:rgb(220 220 220/var(--tw-border-opacity,1));border-radius:5px;border-width:1px;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);overflow:hidden;padding:0;position:relative;transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}::-webkit-scrollbar{height:10px;width:10px}::-webkit-scrollbar-track{background:#f6f6f6;border-radius:5px;border-top:1px solid #dcdcdc;border-top-left-radius:0;border-top-right-radius:0}::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.hide-scroll ::-webkit-scrollbar-thumb,.hide-scroll::-webkit-scrollbar-thumb,.loading ::-webkit-scrollbar-thumb{background:transparent}.vehicle-info-body{display:flex;flex-direction:column;overflow:hidden;position:relative;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-content{transition-duration:.3s;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);width:100%}.vehicle-info-header{--tw-border-opacity:1;--tw-bg-opacity:1;align-items:center;background-color:rgb(246 246 246/var(--tw-bg-opacity,1));border-color:rgb(237 237 237/var(--tw-border-opacity,1));border-width:1px;display:flex;height:54px;justify-content:center;text-align:center}.vehicle-info-header-vin{display:inline-block;font-size:16px;transition-duration:.15s;transition-duration:.4s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-header-vin span{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.loading .vehicle-info-header-vin{--tw-scale-x:1.5;--tw-scale-y:1.5;opacity: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));visibility:hidden}.shift-skeleton{border-radius:4px!important;position:relative!important}.loading .shift-skeleton,.loading.shift-skeleton{overflow:hidden!important;pointer-events:none!important;position:relative!important}.shift-skeleton:after{background:linear-gradient(-45deg,#d4d8de,#e2e5e9,#d4d8de);background-size:300% 300%;border-radius:4px!important;content:\"\";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transform-origin:left;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:10}.loading .shift-skeleton:after,.loading.shift-skeleton:after{--tw-scale-x:1;animation:shimmer 2s ease-in-out infinite;opacity:1;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))}@keyframes shimmer{0%{background-position:100% 0}50%{background-position:0 100%}to{background-position:100% 0}}:host{all:initial!important;display:block}*{font-family:Arial}.static{position:static}.h-\\[200px\\]{height:200px}.w-full{width:100%}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.z-40{z-index:40}.float-right{float:right}.mx-auto{margin-left:auto;margin-right:auto}.mr-\\[16px\\]{margin-right:16px}.mt-\\[16px\\]{margin-top:16px}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-\\[84px\\]{width:84px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.shrink-0{flex-shrink:0}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.cursor-pointer{cursor:pointer}.flex-wrap{flex-wrap:wrap}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border-b{border-bottom-width:1px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.font-semibold{font-weight:600}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.delay-200{transition-delay:.2s}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.hidden{display:none}.grow{flex-grow:1}.items-stretch{align-items:stretch}.overflow-auto{overflow:auto}.p-\\[16px\\]{padding:16px}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.mt-\\[32px\\]{margin-top:32px}.h-\\[25px\\]{height:25px}.h-\\[50px\\]{height:50px}.h-\\[8px\\]{height:8px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.pt-\\[16px\\]{padding-top:16px}.pt-\\[40px\\]{padding-top:40px}.text-\\[18px\\]{font-size:18px}.font-bold{font-weight:700}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}.z-50{z-index:50}.size-\\[100px\\]{height:100px;width:100px}.h-auto{height:auto}.max-h-\\[100px\\]{max-height:100px}.w-auto{width:auto}.max-w-\\[100px\\]{max-width:100px}";
157
-
158
- let mockData$5 = {};
159
- const VehicleAccessories = class {
160
- constructor(hostRef) {
161
- registerInstance(this, hostRef);
162
- this.baseUrl = '';
163
- this.isDev = false;
164
- this.coreOnly = false;
165
- this.queryString = '';
166
- this.language = 'en';
167
- this.sharedLocales = sharedLocalesSchema.getDefault();
168
- this.locale = accessoriesSchema.getDefault();
169
- this.state = 'idle';
170
- this.externalVin = null;
171
- this.expandedImage = null;
172
- this.errorMessage = null;
173
- this.closeImageListener = (event) => {
174
- this.closeImage(event);
175
- };
176
- this.openImage = (target, imageSrc) => {
177
- openImageViewer(this, target, imageSrc);
178
- };
179
- this.closeImage = (event) => {
180
- closeImageViewer(this, event);
181
- };
182
- }
183
- async componentWillLoad() {
184
- await this.changeLanguage(this.language);
185
- }
186
- async changeLanguage(newLanguage) {
187
- const localeResponses = await Promise.all([getLocaleLanguage(newLanguage, 'vehicleLookup.accessories', accessoriesSchema), getSharedLocal(newLanguage)]);
188
- this.locale = localeResponses[0];
189
- this.sharedLocales = localeResponses[1];
190
- }
191
- handleSettingData(response) {
192
- if (!response.accessories || !Array.isArray(response.accessories))
193
- response.accessories = [];
194
- this.vehicleInformation = response;
195
- }
196
- async setData(newData, headers = {}) {
197
- clearTimeout(this.networkTimeoutRef);
198
- if (this.abortController)
199
- this.abortController.abort();
200
- this.abortController = new AbortController();
201
- let scopedTimeoutRef;
202
- const isVinRequest = typeof newData === 'string';
203
- const vin = isVinRequest ? newData : newData === null || newData === void 0 ? void 0 : newData.vin;
204
- this.externalVin = vin;
205
- try {
206
- if (!vin || vin.trim().length === 0) {
207
- this.state = 'idle';
208
- return;
209
- }
210
- if (this.state === 'data' || this.state === 'error') {
211
- this.state = (this.state + '-loading');
212
- }
213
- else
214
- this.state = 'loading';
215
- await new Promise(r => {
216
- scopedTimeoutRef = setTimeout(r, 700);
217
- this.networkTimeoutRef = scopedTimeoutRef;
218
- });
219
- const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$5 }, headers) : newData;
220
- if (this.networkTimeoutRef === scopedTimeoutRef) {
221
- if (!vehicleResponse)
222
- throw new Error('wrongResponseFormat');
223
- this.handleSettingData(vehicleResponse);
224
- }
225
- this.errorMessage = null;
226
- this.state = 'data';
227
- }
228
- catch (error) {
229
- if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
230
- return;
231
- if (this.errorCallback)
232
- this.errorCallback(error.message);
233
- console.error(error);
234
- this.setErrorMessage(error.message);
235
- }
236
- }
237
- async setErrorMessage(message) {
238
- this.state = 'error';
239
- this.vehicleInformation = null;
240
- this.errorMessage = message;
241
- }
242
- async fetchData(requestedVin = this.externalVin, headers = {}) {
243
- await this.setData(requestedVin, headers);
244
- }
245
- async loadingListener() {
246
- if (this.loadingStateChange)
247
- this.loadingStateChange(this.state.includes('loading'));
248
- }
249
- async setMockData(newMockData) {
250
- mockData$5 = newMockData;
251
- }
252
- render() {
253
- var _a, _b;
254
- const texts = this.locale;
255
- const accessories = (this === null || this === void 0 ? void 0 : this.vehicleInformation) ? (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.accessories : [];
256
- const isLoading = this.state.includes('loading');
257
- const isError = this.state.includes('error');
258
- const tableHeaders = [
259
- {
260
- width: 300,
261
- key: 'partNumber',
262
- label: texts.partNumber,
263
- },
264
- {
265
- width: 500,
266
- key: 'description',
267
- label: texts.description,
268
- },
269
- {
270
- width: 200,
271
- key: 'image',
272
- label: texts.image,
273
- },
274
- ];
275
- const rows = accessories.map(accessory => ({
276
- partNumber: accessory.partNumber,
277
- description: accessory.description,
278
- image: () => (h("div", { class: "size-[100px] flex mx-auto items-center justify-center" }, 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-[100px] max-h-[100px] cursor-pointer shadow-sm rounded-lg transition-all duration-300", src: accessory.image })))),
279
- }));
280
- const templateRow = {
281
- image: () => h("div", { key: 'e206bfbe73e7f36af434d6b483e86a291b828eb9', class: "size-[100px] flex mx-auto items-center justify-center" }, "\u00A0"),
282
- };
283
- return (h(Host, { key: '9121fcca463a60fa2741892b20bb8c78a7c5d5fa' }, h("div", { key: '417621627a29bae8a356e573a5b431e1c8a5f26d', 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', {
284
- 'pointer-events-auto opacity-100 delay-200': this.expandedImage,
285
- }) }, h("button", { key: '3dd1dc4fdd1026bf6fcb920831a768621cee81ae', class: "flex flex-col mt-[16px] items-center justify-center size-12 float-right mr-[16px]", onClick: () => this.closeImage() }, h("div", { key: '7f5642c282cf3801c60d937d629e76eb8d0ff7f8', class: "h-1 w-12 rounded-full rotate-45 absolute bg-white" }), h("div", { key: 'f3e94ad90e9c0db35758c0dd395790992a763904', class: "h-1 w-12 rounded-full -rotate-45 absolute bg-white" }))), h("img", { key: '5ba586780d2f7317b6cfaad2f6671ad11b6875f9', alt: "", id: "expanded-image", class: "fixed opacity-0 z-50 transition-all rounded-lg" }), h(VehicleInfoLayout, { key: 'd066b377f7690f16a00a18a8616b1e6226a669f7', isError: isError, isLoading: isLoading, coreOnly: this.coreOnly, vin: (_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vin, direction: this.sharedLocales.direction, errorMessage: this.sharedLocales.errors[this.errorMessage] || this.sharedLocales.errors.wildCard }, h("div", { key: '7322ca14dd37f48759a6a2cf7cc660253556b4b7', class: "overflow-x-auto" }, h("information-table", { key: '074c46fa587d90faef22a0a9e7410fdeca3a3f5c', templateRow: templateRow, rows: rows, headers: tableHeaders, isLoading: isLoading })))));
286
- }
287
- get el() { return getElement(this); }
288
- static get watchers() { return {
289
- "language": ["changeLanguage"],
290
- "state": ["loadingListener"]
291
- }; }
292
- };
293
- VehicleAccessories.style = vehicleAccessoriesCss;
294
-
295
- function scrollIntoContainerView(item, container) {
296
- const itemRect = item.getBoundingClientRect();
297
- const containerRect = container.getBoundingClientRect();
298
- const isPartiallyHidden = itemRect.left < containerRect.left || itemRect.right > containerRect.right;
299
- if (isPartiallyHidden) {
300
- const scrollLeft = item.offsetLeft - container.clientWidth / 2 + item.clientWidth / 2;
301
- container.scrollTo({
302
- left: scrollLeft,
303
- behavior: 'smooth',
304
- });
305
- }
306
- }
307
-
308
- const expiredSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9ImJsYWNrIiBzdHJva2U9ImJsYWNrIiAvPgogICAgICAgIDxwYXRoIGQ9Ik0xNiAxNkw4IDgiIHN0cm9rZS13aWR0aD0iMS4yIiBzdHJva2U9ImJsYWNrIiAvPgogICAgICAgIDxwYXRoIGQ9Ik0xNiA4TDggMTYiIHN0cm9rZS13aWR0aD0iMS4yIiBzdHJva2U9ImJsYWNrIiAvPgogICAgPC9nPgo8L3N2Zz4=';
309
-
310
- const pendingSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9IiNhMWExYTEiIHN0cm9rZT0iI2ExYTFhMSIgLz4KICAgICAgICA8cmVjdCB4PSI5LjUiIHk9IjgiIHdpZHRoPSIyIiBoZWlnaHQ9IjgiIGZpbGw9IiNhMWExYTEiIC8+CiAgICAgICAgPHJlY3QgeD0iMTIuNSIgeT0iOCIgd2lkdGg9IjIiIGhlaWdodD0iOCIgZmlsbD0iI2ExYTFhMSIgLz4KICAgIDwvZz4KPC9zdmc+';
311
-
312
- const cancelledSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9IiNhODAwMDAiIHN0cm9rZT0iI2E4MDAwMCIgLz4KICAgICAgICA8cGF0aCBkPSJNMTggMThMNiA2IiBzdHJva2Utd2lkdGg9IjEuMiIgc3Ryb2tlPSIjYTgwMDAwIiAvPgogICAgPC9nPgo8L3N2Zz4=';
313
-
314
- const processedSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBzdHJva2Utd2lkdGg9IjAiIC8+CiAgICA8ZyBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIC8+CiAgICA8Zz4KICAgICAgICA8Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4IiBmaWxsLW9wYWNpdHk9IjAuMjQiIGZpbGw9IiMzMDcxYTkiIHN0cm9rZT0iIzMwNzFhOSIgLz4KICAgICAgICA8cGF0aCBkPSJNOC41IDExTDExLjM5MzkgMTMuODkzOUMxMS40NTI1IDEzLjk1MjUgMTEuNTQ3NSAxMy45NTI1IDExLjYwNjEgMTMuODkzOUwxOS41IDYiIHN0cm9rZT0iIzMwNzFhOSIKICAgICAgICAgICAgc3Ryb2tlLXdpZHRoPSIxLjIiIC8+CiAgICA8L2c+Cjwvc3ZnPg==';
315
-
316
- const activationRequiredSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9InJnYigxNTgsIDE1OCwgMTU4KSIKICAgIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS1sb2FkZXIiPgogICAgPHBhdGggZD0iTTEyIDJ2NCIgLz4KICAgIDxwYXRoIGQ9Im0xNi4yIDcuOCAyLjktMi45IiAvPgogICAgPHBhdGggZD0iTTE4IDEyaDQiIC8+CiAgICA8cGF0aCBkPSJtMTYuMiAxNi4yIDIuOSAyLjkiIC8+CiAgICA8cGF0aCBkPSJNMTIgMTh2NCIgLz4KICAgIDxwYXRoIGQ9Im00LjkgMTkuMSAyLjktMi45IiAvPgogICAgPHBhdGggZD0iTTIgMTJoNCIgLz4KICAgIDxwYXRoIGQ9Im00LjkgNC45IDIuOSAyLjkiIC8+Cjwvc3ZnPgo=';
317
-
318
- const vehicleClaimableItemsCss = "@tailwind base;@tailwind utilities;@tailwind components;*,: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}.invisible{visibility:hidden}.relative{position:relative}.block{display:block}.flex{display:flex}.hidden{display:none}.h-\\[54px\\]{height:54px}.flex-shrink{flex-shrink:1}.scale-\\[1\\.5\\]{--tw-scale-x:1.5;--tw-scale-y:1.5}.scale-\\[1\\.5\\],.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))}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-\\[3px\\]{gap:3px}.overflow-hidden{overflow:hidden}.rounded-\\[5px\\]{border-radius:5px}.border{border-width:1px}.border-\\[\\#27ae60\\]{--tw-border-opacity:1;border-color:rgb(39 174 96/var(--tw-border-opacity,1))}.border-\\[\\#dcdcdc\\]{--tw-border-opacity:1;border-color:rgb(220 220 220/var(--tw-border-opacity,1))}.border-\\[\\#ededed\\]{--tw-border-opacity:1;border-color:rgb(237 237 237/var(--tw-border-opacity,1))}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.bg-\\[\\#fdfdfd\\]{--tw-bg-opacity:1;background-color:rgb(253 253 253/var(--tw-bg-opacity,1))}.bg-transparent{background-color:transparent}.fill-\\[\\#27ae60\\]{fill:#27ae60}.stroke-\\[\\#27ae60\\]{stroke:#27ae60}.p-0{padding:0}.pr-\\[10px\\]{padding-right:10px}.text-center{text-align:center}.text-\\[16px\\]{font-size:16px}.font-bold{font-weight:700}.text-\\[\\#27ae60\\]{--tw-text-opacity:1;color:rgb(39 174 96/var(--tw-text-opacity,1))}.opacity-0{opacity:0}.shadow-\\[inset_0_1px_3px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.05\\)\\2c 0_1px_0_rgba\\(255\\2c 255\\2c 255\\2c 0\\.1\\)\\]{--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-\\[0\\.4s\\]{transition-duration:.4s}.vehicle-info-container{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 var(--tw-shadow-color);background-color:rgb(253 253 253/var(--tw-bg-opacity,1));border-color:rgb(220 220 220/var(--tw-border-opacity,1));border-radius:5px;border-width:1px;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);overflow:hidden;padding:0;position:relative;transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}::-webkit-scrollbar{height:10px;width:10px}::-webkit-scrollbar-track{background:#f6f6f6;border-radius:5px;border-top:1px solid #dcdcdc;border-top-left-radius:0;border-top-right-radius:0}::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.hide-scroll ::-webkit-scrollbar-thumb,.hide-scroll::-webkit-scrollbar-thumb,.loading ::-webkit-scrollbar-thumb{background:transparent}.vehicle-info-body{display:flex;flex-direction:column;overflow:hidden;position:relative;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-content{transition-duration:.3s;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);width:100%}.vehicle-info-header{--tw-border-opacity:1;--tw-bg-opacity:1;align-items:center;background-color:rgb(246 246 246/var(--tw-bg-opacity,1));border-color:rgb(237 237 237/var(--tw-border-opacity,1));border-width:1px;display:flex;height:54px;justify-content:center;text-align:center}.vehicle-info-header-vin{display:inline-block;font-size:16px;transition-duration:.15s;transition-duration:.4s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-header-vin span{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.loading .vehicle-info-header-vin{--tw-scale-x:1.5;--tw-scale-y:1.5;opacity: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));visibility:hidden}: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}.claimable-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%)}}.claimable-item-footer{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box}.claimable-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}}.claimable-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}}.processed .claimable-item-circle{background-color:#3071a9}.processed .claimable-item-header{color:#3071a9}.expired .claimable-item-circle{background-color:#282828}.expired .claimable-item-header{color:#282828}.cancelled .claimable-item-circle{background-color:#a80000}.cancelled .claimable-item-header{color:#a80000}.pending .claimable-item-circle{background-color:#00a300}.pending .claimable-item-header{color:#00a300}.activationRequired .claimable-item-header{color:#9e9e9e}.loading .lane-inc{animation:lane-increase 2.5s ease infinite}.loading .lane-dec{animation:lane-decrease 2.5s ease 1s infinite}@keyframes lane-increase{0%{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes lane-decrease{0%{left:-80%;width:80%}to{left:110%;width:10%}}.claim-button{--tw-border-opacity:1;fill:#27ae60;stroke:#27ae60;--tw-text-opacity:1;align-items:center;background-color:transparent;border-color:rgb(39 174 96/var(--tw-border-opacity,1));border-radius:5px;border-width:1px;color:rgb(39 174 96/var(--tw-text-opacity,1));cursor:pointer;display:flex;font-weight:700;gap:3px;outline:2px solid transparent;outline-offset:2px;padding-right:10px;transition-duration:.2s}.claim-button:hover{--tw-bg-opacity:1;fill:#fff;stroke:#fff;--tw-text-opacity:1;background-color:rgb(46 204 113/var(--tw-bg-opacity,1));color:rgb(255 255 255/var(--tw-text-opacity,1))}.claim-button:active{--tw-bg-opacity:1;background-color:rgb(39 174 96/var(--tw-bg-opacity,1))}.claim-button circle{fill:#2ecc71}.claim-button circle:hover{fill:#fff}.claim-button svg:active{--tw-scale-x:125%;--tw-scale-y:125%;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))}.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}.warning-card{background:#fcf8e3;border-color:#faebcc!important;color:#8a6d3b}.activation-panel{opacity:0}.activation-panel.visible{animation:activation-panel-fade-in .75s ease forwards}.activation-panel.visible.loading{animation:activation-panel-fade-out .75s ease forwards}@keyframes activation-panel-fade-in{0%{opacity:0;transform:translateY(-5px) scale(70%);visibility:hidden}to{opacity:1;transform:translateY(0) scale(100%);visibility:visible}}@keyframes activation-panel-fade-out{to{opacity:0;transform:translateY(-5px) scale(70%);visibility:hidden}0%{opacity:1;transform:translateY(0) scale(100%);visibility:visible}}.claim-button path{transition:.2s}.claim-button:hover path{fill:#2ecc71}.hover\\:bg-\\[\\#2ecc71\\]:hover{--tw-bg-opacity:1;background-color:rgb(46 204 113/var(--tw-bg-opacity,1))}.hover\\:fill-white:hover{fill:#fff}.hover\\:stroke-white:hover{stroke:#fff}.hover\\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.active\\:bg-\\[\\#27ae60\\]:active{--tw-bg-opacity:1;background-color:rgb(39 174 96/var(--tw-bg-opacity,1))}.\\[\\&_circle\\]\\:fill-\\[\\#2ecc71\\] circle{fill:#2ecc71}.hover\\:\\[\\&_circle\\]\\:fill-white circle:hover{fill:#fff}.active\\:\\[\\&_svg\\]\\:scale-\\[125\\%\\] svg:active{--tw-scale-x:125%;--tw-scale-y:125%;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))}.static{position:static}.h-\\[200px\\]{height:200px}.w-full{width:100%}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.absolute{position:absolute}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.z-40{z-index:40}.float-right{float:right}.mx-auto{margin-left:auto;margin-right:auto}.mr-\\[16px\\]{margin-right:16px}.mt-\\[16px\\]{margin-top:16px}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-\\[84px\\]{width:84px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.shrink-0{flex-shrink:0}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.flex-wrap{flex-wrap:wrap}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border-b{border-bottom-width:1px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.font-semibold{font-weight:600}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.opacity-100{opacity:1}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.delay-200{transition-delay:.2s}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.grow{flex-grow:1}.items-stretch{align-items:stretch}.overflow-auto{overflow:auto}.p-\\[16px\\]{padding:16px}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.mt-\\[32px\\]{margin-top:32px}.h-\\[25px\\]{height:25px}.h-\\[50px\\]{height:50px}.h-\\[8px\\]{height:8px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.pt-\\[16px\\]{padding-top:16px}.pt-\\[40px\\]{padding-top:40px}.text-\\[18px\\]{font-size:18px}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}.\\!visible{visibility:visible!important}.bottom-0{bottom:0}.bottom-\\[40px\\]{bottom:40px}.left-1\\/2{left:50%}.\\!z-\\[-1\\]{z-index:-1!important}.z-0{z-index:0}.z-\\[100\\]{z-index:100}.z-\\[101\\]{z-index:101}.z-\\[1\\]{z-index:1}.m-0{margin:0}.m-auto{margin:auto}.ml-\\[-45\\%\\]{margin-left:-45%}.mt-\\[15px\\]{margin-top:15px}.mt-\\[1px\\]{margin-top:1px}.table{display:table}.size-\\[30px\\]{height:30px;width:30px}.h-0{height:0}.h-\\[10px\\]{height:10px}.h-\\[18px\\]{height:18px}.h-\\[320px\\]{height:320px}.h-\\[3em\\]{height:3em}.h-\\[4\\.5em\\]{height:4.5em}.h-full{height:100%}.\\!w-0{width:0!important}.w-0{width:0}.w-\\[150\\%\\]{width:150%}.w-\\[18px\\]{width:18px}.w-\\[80\\%\\]{width:80%}.w-\\[90\\%\\]{width:90%}.w-\\[calc\\(100\\%-62px\\)\\]{width:calc(100% - 62px)}.w-auto{width:auto}.min-w-\\[250px\\]{min-width:250px}.flex-1{flex:1 1 0%}.border-collapse{border-collapse:collapse}.\\!translate-y-\\[-5px\\]{--tw-translate-y:-5px!important}.\\!translate-y-\\[-5px\\],.\\!translate-y-\\[10px\\]{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))!important}.\\!translate-y-\\[10px\\]{--tw-translate-y:10px!important}.translate-y-\\[-50\\%\\]{--tw-translate-y:-50%}.translate-y-\\[-50\\%\\],.translate-y-\\[-5px\\]{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))}.translate-y-\\[-5px\\]{--tw-translate-y:-5px}.translate-y-\\[-9px\\]{--tw-translate-y:-9px}.translate-y-\\[-9px\\],.translate-y-\\[2px\\]{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))}.translate-y-\\[2px\\]{--tw-translate-y:2px}.\\!scale-\\[150\\%\\]{--tw-scale-x:150%!important;--tw-scale-y:150%!important}.\\!scale-\\[150\\%\\],.\\!scale-\\[70\\%\\]{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))!important}.\\!scale-\\[70\\%\\]{--tw-scale-x:70%!important;--tw-scale-y:70%!important}.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))}.justify-around{justify-content:space-around}.gap-2{gap:.5rem}.gap-\\[5px\\]{gap:5px}.overflow-x-hidden{overflow-x:hidden}.overflow-x-scroll{overflow-x:scroll}.text-ellipsis{text-overflow:ellipsis}.rounded-\\[10px\\]{border-radius:10px}.rounded-\\[4px\\]{border-radius:4px}.rounded-\\[50\\%\\]{border-radius:50%}.border-\\[10px\\]{border-width:10px}.border-\\[5px\\]{border-width:5px}.border-t-0{border-top-width:0}.border-double{border-style:double}.border-\\[\\#ddd\\]{--tw-border-opacity:1;border-color:rgb(221 221 221/var(--tw-border-opacity,1))}.border-\\[\\#ececec\\]{--tw-border-opacity:1;border-color:rgb(236 236 236/var(--tw-border-opacity,1))}.border-transparent{border-color:transparent}.\\!border-b-\\[\\#dddddd\\]{--tw-border-opacity:1!important;border-bottom-color:rgb(221 221 221/var(--tw-border-opacity,1))!important}.\\!border-b-\\[\\#f9f9f9\\]{--tw-border-opacity:1!important;border-bottom-color:rgb(249 249 249/var(--tw-border-opacity,1))!important}.bg-\\[\\#1a1a1a\\]{--tw-bg-opacity:1;background-color:rgb(26 26 26/var(--tw-bg-opacity,1))}.bg-\\[\\#a1a1a1\\]{--tw-bg-opacity:1;background-color:rgb(161 161 161/var(--tw-bg-opacity,1))}.bg-\\[\\#f2f2f2\\]{--tw-bg-opacity:1;background-color:rgb(242 242 242/var(--tw-bg-opacity,1))}.bg-\\[\\#f9f9f9\\]{--tw-bg-opacity:1;background-color:rgb(249 249 249/var(--tw-bg-opacity,1))}.bg-\\[linear-gradient\\(to_bottom\\2c _\\#428bca_0\\%\\2c _\\#3071a9_100\\%\\)\\]{background-image:linear-gradient(180deg,#428bca,#3071a9)}.p-\\[20px\\]{padding:20px}.px-\\[20px\\]{padding-left:20px;padding-right:20px}.px-\\[30px\\]{padding-left:30px;padding-right:30px}.py-\\[10px\\]{padding-bottom:10px;padding-top:10px}.font-\\[14px\\]{font-weight:14px}.leading-\\[1\\.5em\\]{line-height:1.5em}.leading-\\[1em\\]{line-height:1em}.text-\\[\\#282828\\]{--tw-text-opacity:1;color:rgb(40 40 40/var(--tw-text-opacity,1))}.\\!opacity-0{opacity:0!important}.\\!opacity-100{opacity:1!important}.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)}.hover\\:\\[\\&\\>img\\]\\:rotate-\\[360deg\\]>img:hover{--tw-rotate:360deg}.hover\\:\\[\\&\\>img\\]\\:rotate-\\[360deg\\]>img:hover,.hover\\:\\[\\&\\>img\\]\\:scale-\\[125\\%\\]>img:hover{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))}.hover\\:\\[\\&\\>img\\]\\:scale-\\[125\\%\\]>img:hover{--tw-scale-x:125%;--tw-scale-y:125%}.\\[\\&_td\\]\\:whitespace-nowrap td{white-space:nowrap}.\\[\\&_td\\]\\:border-b td{border-bottom-width:1px}.\\[\\&_td\\]\\:border-\\[\\#ddd\\] td{--tw-border-opacity:1;border-color:rgb(221 221 221/var(--tw-border-opacity,1))}.\\[\\&_td\\]\\:p-\\[10px\\] td{padding:10px}.\\[\\&_td\\]\\:pe-\\[50px\\] td{padding-inline-end:50px}.\\[\\&_td\\]\\:text-start td{text-align:start}.\\[\\&_th\\]\\:whitespace-nowrap th{white-space:nowrap}.\\[\\&_th\\]\\:border-b th{border-bottom-width:1px}.\\[\\&_th\\]\\:border-\\[\\#ddd\\] th{--tw-border-opacity:1;border-color:rgb(221 221 221/var(--tw-border-opacity,1))}.\\[\\&_th\\]\\:p-\\[10px\\] th{padding:10px}.\\[\\&_th\\]\\:pe-\\[50px\\] th{padding-inline-end:50px}.\\[\\&_th\\]\\:text-start th{text-align:start}.-z-10{z-index:-10}.m-\\[3px\\]{margin:3px}.my-4{margin-bottom:1rem;margin-top:1rem}.mb-\\[12px\\]{margin-bottom:12px}.ml-1{margin-left:.25rem}.mt-\\[50px\\]{margin-top:50px}.mt-\\[55px\\]{margin-top:55px}.box-border{box-sizing:border-box}.size-\\[100px\\]{height:100px;width:100px}.size-\\[130px\\]{height:130px;width:130px}.size-\\[24px\\]{height:24px;width:24px}.size-\\[32px\\]{height:32px;width:32px}.h-\\[30px\\]{height:30px}.h-\\[32px\\]{height:32px}.w-\\[300px\\]{width:300px}.min-w-\\[100dvw\\]{min-width:100dvw}.max-w-\\[200px\\]{max-width:200px}.border-separate{border-collapse:separate}.-translate-y-\\[32px\\]{--tw-translate-y:-32px}.-translate-y-\\[32px\\],.translate-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))}.translate-y-0{--tw-translate-y:0px}.translate-y-\\[32px\\]{--tw-translate-y:32px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-default{cursor:default}.select-none{user-select:none}.list-disc{list-style-type:disc}.justify-between{justify-content:space-between}.truncate{overflow:hidden;white-space:nowrap}.text-ellipsis,.truncate{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.border-\\[2px\\]{border-width:2px}.border-\\[\\#3071a9\\]{--tw-border-opacity:1;border-color:rgb(48 113 169/var(--tw-border-opacity,1))}.bg-\\[\\#275e8f\\]{--tw-bg-opacity:1;background-color:rgb(39 94 143/var(--tw-bg-opacity,1))}.bg-\\[\\#d5d5d5\\]{--tw-bg-opacity:1;background-color:rgb(213 213 213/var(--tw-bg-opacity,1))}.p-\\[50px\\]{padding:50px}.px-\\[75px\\]{padding-left:75px;padding-right:75px}.ps-\\[4px\\]{padding-inline-start:4px}.ps-\\[8px\\]{padding-inline-start:8px}.pt-\\[8px\\]{padding-top:8px}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.opacity-50{opacity:.5}.transition-\\[width\\]{transition-duration:.15s;transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-700{transition-duration:.7s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\\:bg-\\[\\#3071a9\\]:hover{--tw-bg-opacity:1;background-color:rgb(48 113 169/var(--tw-bg-opacity,1))}.hover\\:bg-red-600:hover{--tw-bg-opacity:1;background-color:rgb(220 38 38/var(--tw-bg-opacity,1))}.active\\:bg-\\[\\#223f57\\]:active{--tw-bg-opacity:1;background-color:rgb(34 63 87/var(--tw-bg-opacity,1))}";
319
-
320
- var __rest = (undefined && undefined.__rest) || function (s, e) {
321
- var t = {};
322
- for (var p in s)
323
- if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
324
- t[p] = s[p];
325
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
326
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
327
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
328
- t[p[i]] = s[p[i]];
329
- }
330
- return t;
331
- };
332
- let mockData$4 = {};
333
- const icons = {
334
- expired: expiredSvg,
335
- pending: pendingSvg,
336
- processed: processedSvg,
337
- cancelled: cancelledSvg,
338
- activationRequired: activationRequiredSvg,
339
- };
340
- const VehicleClaimableItems = class {
341
- constructor(hostRef) {
342
- registerInstance(this, hostRef);
343
- this.headers = {};
344
- this.isDev = false;
345
- this.queryString = '';
346
- this.coreOnly = false;
347
- this.language = 'en';
348
- this.maximumDocumentFileSizeInMb = 30;
349
- this.claimEndPoint = 'api/vehicle/swift-claim';
350
- this.sharedLocales = sharedLocalesSchema.getDefault();
351
- this.locale = claimableItemsSchema.getDefault();
352
- this.activeTab = '';
353
- this.isError = false;
354
- this.showPopup = false;
355
- this.isLoading = false;
356
- this.externalVin = null;
357
- this.showPrintBox = false;
358
- this.errorMessage = null;
359
- this.tabAnimationLoading = false;
360
- this.activePopupIndex = null;
361
- this.tabs = [];
362
- this.lastSuccessfulClaimResponse = null;
363
- this.pendingItemHighlighted = false;
364
- this.onMouseLeave = () => {
365
- clearTimeout(this.timeoutRef);
366
- this.showPopup = false;
367
- this.timeoutRef = setTimeout(() => {
368
- this.activePopupIndex = null;
369
- }, 400);
370
- };
371
- this.onMouseEnter = (dynamicClaimItemHeader, idx) => {
372
- clearTimeout(this.timeoutRef);
373
- this.activePopupIndex = idx;
374
- this.timeoutRef = setTimeout(() => {
375
- const positionRef = dynamicClaimItemHeader.querySelector('.popup-ref');
376
- this.popupPositionRef = positionRef;
377
- this.calculatePopupPos(this.el.shadowRoot);
378
- this.showPopup = true;
379
- }, 50);
380
- };
381
- this.getServiceItems = () => {
382
- var _a, _b, _c, _d, _e;
383
- if (!((_b = (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.serviceItems) === null || _b === void 0 ? void 0 : _b.length))
384
- return [];
385
- if (!((_c = this.tabs) === null || _c === void 0 ? void 0 : _c.length))
386
- return (_d = this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.serviceItems;
387
- return (_e = this.vehicleInformation) === null || _e === void 0 ? void 0 : _e.serviceItems.filter(serviceItem => { var _a; return ((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.group) === null || _a === void 0 ? void 0 : _a.name) === this.activeTab; });
388
- };
389
- this.onActiveTabChange = ({ label }) => {
390
- this.tabAnimationLoading = true;
391
- clearTimeout(this.tabAnimationTimeoutRef);
392
- this.tabAnimationTimeoutRef = setTimeout(() => {
393
- this.activeTab = label;
394
- this.claimableContentWrapper.scrollLeft = 0;
395
- setTimeout(() => {
396
- this.tabAnimationLoading = false;
397
- this.updateProgressBar();
398
- }, 100);
399
- }, 500);
400
- };
401
- }
402
- async componentWillLoad() {
403
- await this.changeLanguage(this.language);
404
- }
405
- async changeLanguage(newLanguage) {
406
- const localeResponses = await Promise.all([getLocaleLanguage(newLanguage, 'vehicleLookup.claimableItems', claimableItemsSchema), getSharedLocal(newLanguage)]);
407
- this.locale = localeResponses[0];
408
- this.sharedLocales = localeResponses[1];
409
- }
410
- async componentDidLoad() {
411
- this.claimableContentWrapper = this.el.shadowRoot.querySelector('.claimable-content-wrapper');
412
- this.claimForm = this.el.shadowRoot.getElementById('vehicle-item-claim-form');
413
- this.progressBar = this.el.shadowRoot.querySelector('.progress-bar');
414
- }
415
- async setMockData(newMockData) {
416
- mockData$4 = newMockData;
417
- }
418
- async setData(newData, headers = {}) {
419
- var _a;
420
- clearTimeout(this.networkTimeoutRef);
421
- if (this.abortController)
422
- this.abortController.abort();
423
- this.abortController = new AbortController();
424
- let scopedTimeoutRef;
425
- const isVinRequest = typeof newData === 'string';
426
- const vin = isVinRequest ? newData : newData === null || newData === void 0 ? void 0 : newData.vin;
427
- this.externalVin = vin;
428
- try {
429
- if (!vin || vin.trim().length === 0) {
430
- this.isError = false;
431
- this.vehicleInformation = null;
432
- return;
433
- }
434
- this.isLoading = true;
435
- this.showPrintBox = false;
436
- await new Promise(r => {
437
- scopedTimeoutRef = setTimeout(r, 1000);
438
- this.networkTimeoutRef = scopedTimeoutRef;
439
- });
440
- this.claimableContentWrapper.scrollLeft = 0;
441
- const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$4 }, headers) : newData;
442
- if (this.networkTimeoutRef === scopedTimeoutRef) {
443
- if (!vehicleResponse)
444
- throw new Error('wrongResponseFormat');
445
- if (!Array.isArray(vehicleResponse.serviceItems))
446
- throw new Error('noServiceAvailable');
447
- this.vehicleInformation = vehicleResponse;
448
- if ((_a = vehicleResponse === null || vehicleResponse === void 0 ? void 0 : vehicleResponse.serviceItems) === null || _a === void 0 ? void 0 : _a.length) {
449
- let orderedGroups = [];
450
- const unOrderedGroups = [];
451
- vehicleResponse.serviceItems.forEach(({ group }) => {
452
- if (!(group === null || group === void 0 ? void 0 : group.name))
453
- return;
454
- if ([...orderedGroups, ...unOrderedGroups].find(g => (g === null || g === void 0 ? void 0 : g.name) === (group === null || group === void 0 ? void 0 : group.name)))
455
- return;
456
- if (group === null || group === void 0 ? void 0 : group.isDefault)
457
- this.activeTab = group === null || group === void 0 ? void 0 : group.name;
458
- if (typeof (group === null || group === void 0 ? void 0 : group.tabOrder) === 'number')
459
- orderedGroups.push(group);
460
- else
461
- unOrderedGroups.push(group);
462
- });
463
- if (!!unOrderedGroups.length || !!orderedGroups.length) {
464
- orderedGroups = orderedGroups.sort((a, b) => a.tabOrder - b.tabOrder);
465
- this.tabs = [...orderedGroups, ...unOrderedGroups];
466
- if (!this.activeTab)
467
- this.activeTab = this.tabs[0].name;
468
- }
469
- else {
470
- this.tabs = [];
471
- this.activeTab = '';
472
- }
473
- }
474
- else {
475
- this.tabs = [];
476
- this.activeTab = '';
477
- }
478
- }
479
- this.errorMessage = null;
480
- this.isLoading = false;
481
- this.isError = false;
482
- }
483
- catch (error) {
484
- if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
485
- return;
486
- if (this.errorCallback)
487
- this.errorCallback(error.message);
488
- console.error(error);
489
- this.setErrorMessage(error.message);
490
- }
491
- }
492
- async setErrorMessage(message) {
493
- this.isError = true;
494
- this.isLoading = false;
495
- this.vehicleInformation = null;
496
- this.errorMessage = message;
497
- }
498
- async fetchData(requestedVin = this.externalVin, headers = {}) {
499
- await this.setData(requestedVin, headers);
500
- }
501
- onLoadingChange(newValue) {
502
- if (this.loadingStateChange)
503
- this.loadingStateChange(newValue);
504
- this.setLoadingUi(newValue);
505
- }
506
- async setLoadingUi(isLoading) {
507
- if (!isLoading) {
508
- this.progressBar.style.width = '0';
509
- this.progressBar.style.opacity = '0';
510
- await new Promise(r => setTimeout(r, 200));
511
- this.updateProgressBar();
512
- }
513
- }
514
- updateProgressBar() {
515
- var _a, _b;
516
- const serviceItems = this.getServiceItems();
517
- if (!!((_a = this.tabs) === null || _a === void 0 ? void 0 : _a.length) && this.tabs.find(tab => tab.name === this.activeTab) && !((_b = this.tabs.find(tab => tab.name === this.activeTab)) === null || _b === void 0 ? void 0 : _b.isSequential)) {
518
- this.progressBar.style.width = '0%';
519
- this.progressBar.style.opacity = '0';
520
- return;
521
- }
522
- if (serviceItems.filter(x => x.status === 'pending').length === 0) {
523
- if (serviceItems.length === 0 || serviceItems.filter(x => x.status === 'activationRequired').length === serviceItems.length) {
524
- this.progressBar.style.width = '0%';
525
- this.progressBar.style.opacity = '0';
526
- }
527
- else {
528
- this.progressBar.style.width = '100%';
529
- this.progressBar.style.opacity = '1';
530
- const claimableItems = this.claimableContentWrapper.getElementsByClassName('claimable-item');
531
- scrollIntoContainerView(claimableItems[claimableItems.length - 1], this.claimableContentWrapper);
532
- }
533
- }
534
- else {
535
- const firstPendingItem = serviceItems.find(x => x.status === 'pending');
536
- const firstPendingItemIndex = serviceItems.indexOf(firstPendingItem) + 1;
537
- const firstPendingItemRef = this.claimableContentWrapper.getElementsByClassName('claimable-item')[firstPendingItemIndex - 1];
538
- this.progressBar.style.width = (firstPendingItemIndex / serviceItems.length - 1 / (serviceItems.length * 2)) * 100 + '%';
539
- this.progressBar.style.opacity = this.progressBar.style.width === '0%' ? '0' : '1';
540
- scrollIntoContainerView(firstPendingItemRef, this.claimableContentWrapper);
541
- }
542
- }
543
- resetProgressBar() {
544
- setTimeout(() => {
545
- this.updateProgressBar();
546
- }, 100);
547
- }
548
- windowScrollListener(newValue) {
549
- if (newValue) {
550
- this.scrollListenerRef = () => this.calculatePopupPos(this.el.shadowRoot);
551
- window.addEventListener('scroll', this.scrollListenerRef);
552
- this.claimableContentWrapper.addEventListener('scroll', this.scrollListenerRef);
553
- }
554
- else {
555
- window.removeEventListener('scroll', this.scrollListenerRef);
556
- this.claimableContentWrapper.removeEventListener('scroll', this.scrollListenerRef);
557
- }
558
- }
559
- calculatePopupPos(root) {
560
- const popupPositionRef = root.querySelector('.popup-ref');
561
- let { x, y } = popupPositionRef.getBoundingClientRect();
562
- const popupContainer = popupPositionRef.querySelector('.popup-container');
563
- const { width } = popupContainer.getBoundingClientRect();
564
- const popupInfo = popupContainer.querySelector('.popup-info');
565
- const windowWidth = window.innerWidth; // Get the viewport's width
566
- popupContainer.style.top = `${y}px`;
567
- popupContainer.style.left = `${x - width / 2}px`;
568
- const offsetFromLeft = x - width / 2; // Distance from left side of the viewport
569
- const offsetFromRight = windowWidth - (x + width / 2); // Distance from right side of the viewport
570
- let movingNeeded = 0;
571
- let horizontalMargin = 16;
572
- if (offsetFromRight < horizontalMargin)
573
- movingNeeded = offsetFromRight - horizontalMargin;
574
- else if (offsetFromLeft < horizontalMargin)
575
- movingNeeded = Math.abs(offsetFromLeft - horizontalMargin);
576
- popupInfo.style.transform = `translateX(${movingNeeded}px)`;
577
- }
578
- removeLoadAnimationClass(event) {
579
- const component = event.target;
580
- component.classList.remove('load-animation');
581
- }
582
- async completeClaim(response) {
583
- const serviceItems = this.getServiceItems();
584
- const item = this.cachedClaimItem;
585
- const serviceDataClone = JSON.parse(JSON.stringify(serviceItems));
586
- const index = serviceItems.indexOf(item);
587
- const pendingItemsBefore = serviceDataClone.slice(0, index).filter(x => x.status === 'pending');
588
- serviceDataClone[index].claimable = false;
589
- serviceDataClone[index].status = 'processed';
590
- pendingItemsBefore.forEach(function (otherItem) {
591
- otherItem.status = 'cancelled';
592
- });
593
- this.pendingItemHighlighted = false;
594
- const vehicleDataClone = JSON.parse(JSON.stringify(this.vehicleInformation));
595
- vehicleDataClone.serviceItems = serviceDataClone;
596
- this.vehicleInformation = JSON.parse(JSON.stringify(vehicleDataClone));
597
- this.showPrintBox = true;
598
- this.lastSuccessfulClaimResponse = response;
599
- }
600
- async claim(item) {
601
- const serviceItems = this.getServiceItems();
602
- const vinDataClone = JSON.parse(JSON.stringify(serviceItems));
603
- const index = serviceItems.indexOf(item);
604
- //Find other items before this item that have status 'pending'
605
- let pendingItemsBefore = vinDataClone.slice(0, index).filter(x => x.status === 'pending');
606
- this.cachedClaimItem = item;
607
- if (item.maximumMileage === null) {
608
- pendingItemsBefore = [];
609
- }
610
- this.onMouseLeave();
611
- this.openRedeem(item, pendingItemsBefore);
612
- }
613
- async handleClaiming() {
614
- if (this.isDev) {
615
- this.claimForm.handleClaiming = async ({ document }) => {
616
- if (document) {
617
- this.claimForm.uploadProgress = 0;
618
- let uploadChunks = 20;
619
- for (let index = 0; index < uploadChunks; index++) {
620
- const uploadPercentage = Math.round(((index + 1) / uploadChunks) * 100);
621
- await new Promise(r => setTimeout(r, 200));
622
- this.claimForm.setFileUploadProgression(uploadPercentage);
623
- }
624
- }
625
- this.claimForm.quite();
626
- this.completeClaim({ Success: true, ID: '11223344', PrintURL: 'http://localhost/test/print/1122' });
627
- this.claimForm.handleClaiming = null;
628
- };
629
- }
630
- else {
631
- this.claimForm.handleClaiming = async (_a) => {
632
- var { document } = _a, payload = __rest(_a, ["document"]);
633
- try {
634
- const formData = new FormData();
635
- formData.append('payload', JSON.stringify(Object.assign(Object.assign({}, payload), { vin: this.vehicleInformation.vin, saleInformation: this.vehicleInformation.saleInformation, serviceItem: this.claimForm.item, cancelledServiceItems: this.claimForm.canceledItems })));
636
- if (document)
637
- formData.append('document', document);
638
- await new Promise((resolve, reject) => {
639
- const xhr = new XMLHttpRequest();
640
- xhr.open('POST', this.claimEndPoint);
641
- Object.entries(this.headers || {}).forEach(([key, value]) => {
642
- xhr.setRequestHeader(key, value);
643
- });
644
- xhr.upload.onprogress = e => {
645
- if (e.lengthComputable)
646
- this.claimForm.setFileUploadProgression(Math.round((e.loaded / e.total) * 100));
647
- };
648
- xhr.onload = () => {
649
- this.claimForm.quite();
650
- this.claimForm.handleClaiming = null;
651
- if (xhr.status === 200) {
652
- try {
653
- const responseData = JSON.parse(xhr.responseText);
654
- this.completeClaim(responseData);
655
- resolve();
656
- }
657
- catch (parseError) {
658
- console.error('Response is not valid JSON', {
659
- rawResponse: xhr.responseText,
660
- error: parseError,
661
- });
662
- reject(new Error('Upload succeeded but response is not valid JSON'));
663
- }
664
- resolve();
665
- }
666
- else {
667
- try {
668
- const responseData = JSON.parse(xhr.responseText);
669
- alert(responseData.Message);
670
- }
671
- catch (_a) {
672
- reject(new Error(`Upload failed with status ${xhr.status}`));
673
- }
674
- }
675
- };
676
- xhr.onerror = e => {
677
- console.log(e);
678
- this.claimForm.quite();
679
- this.claimForm.handleClaiming = null;
680
- reject(new Error('Network error'));
681
- };
682
- xhr.send(formData);
683
- });
684
- }
685
- catch (error) {
686
- console.error(error);
687
- alert(this.sharedLocales.errors.requestFailedPleaseTryAgainLater);
688
- this.claimForm.quite();
689
- this.claimForm.handleClaiming = null;
690
- }
691
- };
692
- }
693
- }
694
- openRedeem(item, oldItems) {
695
- var _a, _b, _c, _d, _e;
696
- const vehicleInformation = this.vehicleInformation;
697
- this.claimForm.vin = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.vin;
698
- this.claimForm.item = item;
699
- this.claimForm.canceledItems = oldItems;
700
- if (((_a = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _a === void 0 ? void 0 : _a.broker) !== null && ((_c = (_b = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _b === void 0 ? void 0 : _b.broker) === null || _c === void 0 ? void 0 : _c.invoiceDate) === null)
701
- this.claimForm.unInvoicedByBrokerName = (_e = (_d = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _d === void 0 ? void 0 : _d.broker) === null || _e === void 0 ? void 0 : _e.brokerName;
702
- else
703
- this.claimForm.unInvoicedByBrokerName = null;
704
- this.handleClaiming();
705
- }
706
- createPopup(item) {
707
- const texts = this.locale;
708
- return (h("div", { dir: this.sharedLocales.direction, class: "popup-ref w-0 h-0 bottom-0 flex absolute justify-center" }, h("div", { class: "popup-container fixed z-[100]" }, h("div", { class: cn('opacity-0 w-full z-[101] flex transition-all duration-[0.4s] relative invisible justify-center translate-y-[-9px]', {
709
- '!opacity-100 !visible': this.showPopup,
710
- }) }, h("div", { class: "absolute w-0 h-0 border-[10px] border-t-0 !border-b-[#dddddd] border-transparent" }), h("div", { class: "mt-[1px] absolute w-0 h-0 border-[10px] border-t-0 !border-b-[#f9f9f9] border-transparent" })), h("div", { class: cn('popup-info bg-[#f9f9f9] border border-[#ddd] w-auto p-[20px] rounded-[5px] transition-all duration-[0.4s] text-[#282828] opacity-0 invisible', {
711
- '!opacity-100 !visible': this.showPopup,
712
- }) }, h("table", { class: cn('w-full border-collapse', '[&_th]:border-b [&_th]:border-[#ddd] [&_th]:p-[10px] [&_th]:pe-[50px] [&_th]:text-start [&_th]:whitespace-nowrap', '[&_td]:border-b [&_td]:border-[#ddd] [&_td]:p-[10px] [&_td]:pe-[50px] [&_td]:text-start [&_td]:whitespace-nowrap') }, 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.claimDate)), h("tr", null, h("th", null, texts.claimingCompany), h("td", null, item.companyName)), h("tr", null, h("th", null, texts.invoiceNumber), h("td", null, item.invoiceNumber)), h("tr", null, h("th", null, texts.jobNumber), h("td", null, item.jobNumber)), h("tr", null, h("th", null, texts.packageCode), h("td", null, item.packageCode)))), item.claimable && (h("button", { onClick: () => this.claim(item), class: "claim-button m-auto mt-[15px] w-[80%] justify-center" }, h("svg", { class: "size-[30px] duration-200", 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)))))));
713
- }
714
- render() {
715
- var _a;
716
- const serviceItems = this.getServiceItems();
717
- const texts = this.locale;
718
- const hasInactiveItems = serviceItems.filter(x => x.status === 'activationRequired').length > 0;
719
- const hideTabs = this.isLoading || this.isError || !this.tabs.length || !serviceItems.length;
720
- const tabs = this.tabs.map(group => group.name);
721
- return (h(Host, { key: '650300d8b2495485e104a8450e6849111f45a843' }, h("vehicle-item-claim-form", { key: '205514a455cab1507e9798c66924d10b6b10e09c', locale: texts.claimForm, language: this.language, id: "vehicle-item-claim-form", maximumDocumentFileSizeInMb: this.maximumDocumentFileSizeInMb }), h(VehicleInfoLayout, { key: '24bcc50ed3fd697fe0e1bd536b04300572905519', isError: this.isError, coreOnly: this.coreOnly, isLoading: this.isLoading, vin: (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin, direction: this.sharedLocales.direction, errorMessage: this.sharedLocales.errors[this.errorMessage] || this.sharedLocales.errors.wildCard }, h("div", { key: 'a133d8beadb9dfc21efc4ea3f3eca8f9c97643e5', class: "absolute z-10 w-full pt-[16px]" }, h("div", { key: '3e27fb454add0e0a7a103bddecafaa98fdf39fea', class: cn('duration-300', { 'translate-y-[-50%] opacity-0': hideTabs }) }, h("shift-tabs", { key: 'a71888699a3189bef9f8391b811c0ab2bbbe82d3', activeTabLabel: this.activeTab, changeActiveTab: this.onActiveTabChange, tabs: tabs }))), h("div", { key: 'f879a081b412cf82ff15592034aa8a190edd5964', class: "relative" }, h("div", { key: 'ce6e960144465d725acf883b14a723835bec1292', class: "flex px-[30px] absolute w-full h-[320px] items-center" }, h("div", { key: 'bf3a6cd026eae91abcd895ae4550098f14648273', class: "h-[10px] translate-y-[-5px] relative bg-[#f2f2f2] border border-[#ddd] rounded-[10px] w-[calc(100%-62px)] items-center justify-around" }, h("div", { key: '0bd1d257ab6a49da3dfb15fda773e0ee7a7b951e', class: "w-full h-full rounded-[4px] overflow-x-hidden absolute left-0 top-0" }, h("div", { key: '73b1ab665d109c6f4e77c975ced5c7f8ff587495', class: "absolute opacity-0 bg-[#1a1a1a] w-[150%] h-full" }), h("div", { key: 'cdce5de783b1c1eec2b50d3775f07997af209bff', class: "absolute h-full bg-[linear-gradient(to_bottom,_#428bca_0%,_#3071a9_100%)] lane-inc" }), h("div", { key: 'c34ecca02274697dd705f522e06d194747e94c76', class: "absolute h-full bg-[linear-gradient(to_bottom,_#428bca_0%,_#3071a9_100%)] lane-dec" })))), h("div", { key: '4230dfc62c4398edb5277c884e2641260ff736d4', dir: "ltr", class: cn('flex overflow-x-scroll px-[30px] relative h-[320px] items-center transition-all duration-300 claimable-content-wrapper', {
722
- 'hide-scroll': this.tabAnimationLoading,
723
- }) }, h("div", { key: 'caa65ad50775e49b88d082409ece04b9a2e20b6a', class: cn('h-[10px] bg-[#f2f2f2] border flex-1 border-[#ddd] rounded-[10px] flex items-center justify-around relative', {
724
- 'bg-transparent border-transparent': this.isLoading || this.tabAnimationLoading || !serviceItems.length,
725
- }) }, serviceItems.map((item, idx) => {
726
- let statusClass = '';
727
- if (item.status === 'pending') {
728
- if (serviceItems.findIndex(i => i.status === 'pending') === idx)
729
- statusClass = item.status;
730
- }
731
- else
732
- statusClass = item.status;
733
- return (h("div", { key: item.name, class: cn('claimable-item flex flex-col items-center gap-[5px] font-[14px] min-w-[250px]', statusClass), onMouseLeave: this.onMouseLeave }, h("div", { onAnimationEnd: this.removeLoadAnimationClass, class: cn('claimable-item-header load-animation hover:[&>img]:rotate-[360deg] hover:[&>img]:scale-[125%] relative duration-[0.4s] py-[10px] leading-[1em] h-[3em] flex flex-col items-center cursor-pointer', {
734
- '!opacity-0 !translate-y-[-5px] !scale-[70%]': this.isLoading || this.tabAnimationLoading,
735
- }), onMouseEnter: event => this.onMouseEnter(event.target, idx) }, h("img", { class: "duration-[0.4s]", src: icons[item.status], alt: "status icon" }), h("span", { dir: this.sharedLocales.direction, class: "font-bold" }, texts[item.status]), this.activePopupIndex === idx && this.createPopup(item)), h("div", { onAnimationEnd: this.removeLoadAnimationClass, class: cn('claimable-item-circle load-animation w-[18px] translate-y-[2px] h-[18px] rounded-[50%] bg-[#a1a1a1] border-[5px] border-double border-[#ececec] transition-all duration-[0.4s] z-[1]', {
736
- '!opacity-0 !scale-[150%]': this.isLoading || this.tabAnimationLoading,
737
- }) }), h("p", { onAnimationEnd: this.removeLoadAnimationClass, class: cn('claimable-item-footer load-animation transition-all duration-[0.4s] px-[20px] text-center leading-[1.5em] h-[4.5em] overflow-hidden text-ellipsis m-0', {
738
- '!opacity-0 !translate-y-[10px] !scale-[70%]': this.isLoading || this.tabAnimationLoading,
739
- }) }, item.name)));
740
- }), h("div", { key: 'bde59a64354da72d443fe00d4f5e655e17f4010b', class: cn('progress-bar h-[10px] opacity-0 bg-[linear-gradient(to_bottom,_#428bca_0%,_#3071a9_100%)] border border-[#ddd] rounded-[10px] w-0 absolute left-0 transition-all duration-500 z-0', {
741
- '!w-0 !opacity-0': this.isLoading || this.tabAnimationLoading,
742
- }) })), h("div", { key: '0d26706af93683381eeb154d660e30888a55ef57', class: cn('absolute w-[90%] left-1/2 ml-[-45%] bottom-[40px] z-[1]', { '!z-[-1]': !(this.vehicleInformation && hasInactiveItems) }) }, h("div", { key: '65f407d2ead8a828ba8cbd85f745286ed7c182a4', class: cn('card warning-card span-entire-1st-row activation-panel', {
743
- loading: this.isLoading || this.tabAnimationLoading,
744
- visible: hasInactiveItems,
745
- }), onAnimationEnd: this.removeLoadAnimationClass }, h("p", { key: '3bc24cddfff666c5e5d6151128e5556246f4191c', class: "no-padding flex gap-2" }, h("span", { key: '97ec53465789ac41c60ba78476865c526516f28d', class: "font-semibold" }, texts.warrantyAndServicesNotActivated)), h("button", { key: '3559fbedb98d0d66a018448b47a0c5ae22181e13', onClick: () => {
746
- if (this.activate) {
747
- this.activate(this.vehicleInformation);
748
- }
749
- }, class: "claim-button" }, h("svg", { key: 'afaad252b24ef036246d7ea4e5dfa0e586072286', class: "size-[30px] duration-200", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '29417f41b50310c2a3196aa09f9ec8356f444b2b', "stroke-width": "0" }), h("g", { key: '337ff662f389278eb4252e67d7297b8104b58ad9', "stroke-linecap": "round", "stroke-linejoin": "round" }), h("g", { key: '69055decd90dbf005e604c49e1b8758766b4e59d' }, h("circle", { key: '0e241fa0f14d0363201609a701bf1fe5d09c611f', cx: "12", cy: "12", r: "8", "fill-opacity": "0.24" }), h("path", { key: 'cdc48fe47ee90b76cb94f6db6fbd2b66170c4fdd', d: "M8.5 11L11.3939 13.8939C11.4525 13.9525 11.5475 13.9525 11.6061 13.8939L19.5 6", "stroke-width": "1.2" }))), h("span", { key: '5cfe67e43afa0342e680e9f195dd37c95f0d2dbb' }, texts.activateNow)))), h("div", { key: '2ecd71e4bd4f8e096473b74e330de8f50272f6c5', class: cn('absolute w-[90%] left-1/2 ml-[-45%] bottom-[40px] z-[1]', { '!z-[-1]': !this.showPrintBox }) }, h("div", { key: 'bda52bd244b2af92b3c6c0501e8f85eded6c56c5', class: cn('card warning-card span-entire-1st-row activation-panel', {
750
- loading: this.isLoading,
751
- visible: this.showPrintBox,
752
- }), onAnimationEnd: this.removeLoadAnimationClass }, h("p", { key: '77be3dfd74e1271f4a6c8799feed44d611733604', class: "no-padding flex gap-2" }, h("span", { key: '7cb43c7a81f928396fe932385955bdbe9543a487', class: "font-semibold" }, texts.successFulClaimMessage)), h("button", { key: 'ea9a839303813a7177b66023cc1f961954f4f91b', onClick: () => {
753
- if (this.print) {
754
- this.print(this.lastSuccessfulClaimResponse);
755
- }
756
- else {
757
- if (this.lastSuccessfulClaimResponse.PrintURL) {
758
- window.open(this.lastSuccessfulClaimResponse.PrintURL, '_blank').focus();
759
- }
760
- }
761
- }, class: "claim-button dynamic-claim-button" }, h("svg", { key: 'fec1b6e0cf6615788bcf9ef246a3e9259ae694f9', width: "30px", height: "30px", viewBox: "-5 -5 36 36", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'f2348cb0d49cb586e28111952f6b0620948b7d25', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M17 7H7V6h10v1zm0 12H7v-6h10v6zm2-12V3H5v4H1v8.996C1 17.103 1.897 18 3.004 18H5v3h14v-3h1.996A2.004 2.004 0 0 0 23 15.996V7h-4z", fill: "rgb(252, 248, 227)" })), h("span", { key: 'cf58fe2d58d553130b8281d28c3057b5a89097e3' }, texts.print)))))))));
762
- }
763
- get el() { return getElement(this); }
764
- static get watchers() { return {
765
- "language": ["changeLanguage"],
766
- "isLoading": ["onLoadingChange"],
767
- "vehicleInformation": ["resetProgressBar"],
768
- "popupClasses": ["windowScrollListener"]
769
- }; }
770
- };
771
- VehicleClaimableItems.style = vehicleClaimableItemsCss;
772
-
773
- const vehiclePaintThicknessCss = "@tailwind base;@tailwind utilities;@tailwind components;*,: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}.invisible{visibility:hidden}.absolute{position:absolute}.\\!relative{position:relative!important}.relative{position:relative}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.block{display:block}.flex{display:flex}.h-\\[54px\\]{height:54px}.origin-left{transform-origin:left}.scale-\\[1\\.5\\]{--tw-scale-x:1.5;--tw-scale-y:1.5;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-hidden{overflow:hidden!important}.overflow-hidden{overflow:hidden}.\\!rounded-\\[4px\\]{border-radius:4px!important}.rounded-\\[5px\\]{border-radius:5px}.border{border-width:1px}.border-\\[\\#dcdcdc\\]{--tw-border-opacity:1;border-color:rgb(220 220 220/var(--tw-border-opacity,1))}.border-\\[\\#ededed\\]{--tw-border-opacity:1;border-color:rgb(237 237 237/var(--tw-border-opacity,1))}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.bg-\\[\\#fdfdfd\\]{--tw-bg-opacity:1;background-color:rgb(253 253 253/var(--tw-bg-opacity,1))}.p-0{padding:0}.text-center{text-align:center}.text-\\[16px\\]{font-size:16px}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow-\\[inset_0_1px_3px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.05\\)\\2c 0_1px_0_rgba\\(255\\2c 255\\2c 255\\2c 0\\.1\\)\\]{--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 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{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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-\\[0\\.4s\\]{transition-duration:.4s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-container{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 var(--tw-shadow-color);background-color:rgb(253 253 253/var(--tw-bg-opacity,1));border-color:rgb(220 220 220/var(--tw-border-opacity,1));border-radius:5px;border-width:1px;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);overflow:hidden;padding:0;position:relative;transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}::-webkit-scrollbar{height:10px;width:10px}::-webkit-scrollbar-track{background:#f6f6f6;border-radius:5px;border-top:1px solid #dcdcdc;border-top-left-radius:0;border-top-right-radius:0}::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.hide-scroll ::-webkit-scrollbar-thumb,.hide-scroll::-webkit-scrollbar-thumb,.loading ::-webkit-scrollbar-thumb{background:transparent}.vehicle-info-body{display:flex;flex-direction:column;overflow:hidden;position:relative;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-content{transition-duration:.3s;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);width:100%}.vehicle-info-header{--tw-border-opacity:1;--tw-bg-opacity:1;align-items:center;background-color:rgb(246 246 246/var(--tw-bg-opacity,1));border-color:rgb(237 237 237/var(--tw-border-opacity,1));border-width:1px;display:flex;height:54px;justify-content:center;text-align:center}.vehicle-info-header-vin{display:inline-block;font-size:16px;transition-duration:.15s;transition-duration:.4s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-header-vin span{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.loading .vehicle-info-header-vin{--tw-scale-x:1.5;--tw-scale-y:1.5;opacity: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));visibility:hidden}.shift-skeleton{border-radius:4px!important;position:relative!important}.loading .shift-skeleton,.loading.shift-skeleton{overflow:hidden!important;pointer-events:none!important;position:relative!important}.shift-skeleton:after{background:linear-gradient(-45deg,#d4d8de,#e2e5e9,#d4d8de);background-size:300% 300%;border-radius:4px!important;content:\"\";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transform-origin:left;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:10}.loading .shift-skeleton:after,.loading.shift-skeleton:after{--tw-scale-x:1;animation:shimmer 2s ease-in-out infinite;opacity:1;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))}@keyframes shimmer{0%{background-position:100% 0}50%{background-position:0 100%}to{background-position:100% 0}}:host{all:initial!important;display:block}*{font-family:Arial}.static{position:static}.h-\\[200px\\]{height:200px}.w-full{width:100%}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.z-40{z-index:40}.float-right{float:right}.mx-auto{margin-left:auto;margin-right:auto}.mr-\\[16px\\]{margin-right:16px}.mt-\\[16px\\]{margin-top:16px}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-\\[84px\\]{width:84px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.shrink-0{flex-shrink:0}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.cursor-pointer{cursor:pointer}.flex-wrap{flex-wrap:wrap}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border-b{border-bottom-width:1px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.font-semibold{font-weight:600}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.delay-200{transition-delay:.2s}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.hidden{display:none}.grow{flex-grow:1}.items-stretch{align-items:stretch}.overflow-auto{overflow:auto}.p-\\[16px\\]{padding:16px}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.mt-\\[32px\\]{margin-top:32px}.h-\\[25px\\]{height:25px}.h-\\[50px\\]{height:50px}.h-\\[8px\\]{height:8px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.pt-\\[16px\\]{padding-top:16px}.pt-\\[40px\\]{padding-top:40px}.text-\\[18px\\]{font-size:18px}.font-bold{font-weight:700}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}";
774
-
775
- let mockData$3 = {};
776
- const VehiclePaintThickness = class {
777
- constructor(hostRef) {
778
- registerInstance(this, hostRef);
779
- this.baseUrl = '';
780
- this.isDev = false;
781
- this.queryString = '';
782
- this.coreOnly = false;
783
- this.language = 'en';
784
- this.sharedLocales = sharedLocalesSchema.getDefault();
785
- this.locale = paintThicknessSchema.getDefault();
786
- this.state = 'idle';
787
- this.externalVin = null;
788
- this.expandedImage = null;
789
- this.errorMessage = null;
790
- this.closeImageListener = (event) => {
791
- this.closeImage(event);
792
- };
793
- this.openImage = (target, imageSrc) => {
794
- openImageViewer(this, target, imageSrc);
795
- };
796
- this.closeImage = (event) => {
797
- closeImageViewer(this, event);
798
- };
799
- }
800
- async componentWillLoad() {
801
- await this.changeLanguage(this.language);
802
- }
803
- async changeLanguage(newLanguage) {
804
- const localeResponses = await Promise.all([getLocaleLanguage(newLanguage, 'vehicleLookup.paintThickness', paintThicknessSchema), getSharedLocal(newLanguage)]);
805
- this.locale = localeResponses[0];
806
- this.sharedLocales = localeResponses[1];
807
- }
808
- handleSettingData(response) {
809
- if (!response.paintThickness)
810
- response.paintThickness = { imageGroups: [], parts: [] };
811
- if (!response.paintThickness.parts || !Array.isArray(response.paintThickness.parts))
812
- response.paintThickness.parts = [];
813
- if (!response.paintThickness.imageGroups || !Array.isArray(response.paintThickness.imageGroups))
814
- response.paintThickness.imageGroups = [];
815
- this.vehicleInformation = response;
816
- }
817
- async setData(newData, headers = {}) {
818
- clearTimeout(this.networkTimeoutRef);
819
- if (this.abortController)
820
- this.abortController.abort();
821
- this.abortController = new AbortController();
822
- let scopedTimeoutRef;
823
- const isVinRequest = typeof newData === 'string';
824
- const vin = isVinRequest ? newData : newData === null || newData === void 0 ? void 0 : newData.vin;
825
- this.externalVin = vin;
826
- try {
827
- if (!vin || vin.trim().length === 0) {
828
- this.state = 'idle';
829
- return;
830
- }
831
- if (this.state === 'data' || this.state === 'error') {
832
- this.state = (this.state + '-loading');
833
- }
834
- else
835
- this.state = 'loading';
836
- await new Promise(r => {
837
- scopedTimeoutRef = setTimeout(r, 700);
838
- this.networkTimeoutRef = scopedTimeoutRef;
839
- });
840
- const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$3 }, headers) : newData;
841
- if (this.networkTimeoutRef === scopedTimeoutRef) {
842
- if (!vehicleResponse)
843
- throw new Error('wrongResponseFormat');
844
- this.handleSettingData(vehicleResponse);
845
- }
846
- this.errorMessage = null;
847
- this.state = 'data';
848
- }
849
- catch (error) {
850
- if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
851
- return;
852
- if (this.errorCallback)
853
- this.errorCallback(error.message);
854
- console.error(error);
855
- this.setErrorMessage(error.message);
856
- }
857
- }
858
- async setErrorMessage(message) {
859
- this.state = 'error';
860
- this.vehicleInformation = null;
861
- this.errorMessage = message;
862
- }
863
- async fetchData(requestedVin = this.externalVin, headers = {}) {
864
- await this.setData(requestedVin, headers);
865
- }
866
- async onInformationUpdate() { }
867
- async loadingListener() {
868
- if (this.loadingStateChange)
869
- this.loadingStateChange(this.state.includes('loading'));
870
- }
871
- async setMockData(newMockData) {
872
- mockData$3 = newMockData;
873
- }
874
- render() {
875
- var _a, _b;
876
- const texts = this.locale;
877
- 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: [] };
878
- const isLoading = this.state.includes('loading');
879
- const isError = this.state.includes('error');
880
- const tableHeaders = [
881
- {
882
- width: 250,
883
- key: 'part',
884
- label: texts.part,
885
- },
886
- {
887
- width: 250,
888
- key: 'left',
889
- label: texts.left,
890
- },
891
- {
892
- width: 250,
893
- key: 'right',
894
- label: texts.right,
895
- },
896
- ];
897
- return (h(Host, { key: '684313a4ae6c73fa75120f29e40c1f42da53ecf1' }, h("div", { key: '52ffb7505f93204c6d1e01f6797468bd498b0262', 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', {
898
- 'pointer-events-auto opacity-100 delay-200': this.expandedImage,
899
- }) }, h("button", { key: '99bf29ebc78fc5f953f50a6b56382298be5180e7', class: "flex flex-col mt-[16px] items-center justify-center size-12 float-right mr-[16px]", onClick: () => this.closeImage() }, h("div", { key: 'f9fd030f776155de16673a053891754471284f05', class: "h-1 w-12 rounded-full rotate-45 absolute bg-white" }), h("div", { key: '64d580355237032dd6316975e04c700f2c44fd0d', class: "h-1 w-12 rounded-full -rotate-45 absolute bg-white" }))), h("img", { key: 'a7f34f1df86362117fbc88e693637be7133a3159', alt: "", id: "expanded-image", class: "fixed opacity-0 z-40 transition-all rounded-lg" }), h(VehicleInfoLayout, { key: '938c38d8a9f0f721ae1b9163c08099144a97b277', isError: isError, isLoading: isLoading, coreOnly: this.coreOnly, vin: (_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.vin, direction: this.sharedLocales.direction, errorMessage: this.sharedLocales.errors[this.errorMessage] || this.sharedLocales.errors.wildCard }, h("div", { key: 'd6b8bb4dc86111fa51c85ad2ccf0eb0b86676551', class: "overflow-x-auto" }, h("information-table", { key: 'e27050c0512cc20b00760eb5037cbb0c3fb8d0f6', rows: parts, headers: tableHeaders, isLoading: isLoading })), h("flexible-container", { key: '42e809506ee4e3e61511635a87c932a2fbd0e70a', isOpened: !isLoading && !!imageGroups.length }, h("div", { key: '19f9f1ac9027459692e4bf266fa0036455486464', class: "py-[16px] gap-[16px] justify-center flex flex-wrap px-[24px] w-full" }, imageGroups.map((imageGroup, index) => (h("div", { class: "shrink-0 rounded-lg shadow-sm border overflow-hidden flex flex-col", key: imageGroup.name + index }, h("h1", { class: "text-center border-b bg-slate-50 font-semibold p-[6px]" }, h("span", { class: "shift-skeleton" }, imageGroup.name)), h("div", { class: "flex max-w-full flex-wrap p-[12px] gap-[8px]" }, imageGroup.images.map((image, idx) => (h("div", { class: cn('flex shift-skeleton gap-[8px]', { loading: !image }), key: image + idx }, 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", { src: image, class: "h-[150px] cursor-pointer shadow-sm rounded-lg w-[84px] transition-all duration-300" }))))))))))))));
900
- }
901
- get el() { return getElement(this); }
902
- static get watchers() { return {
903
- "language": ["changeLanguage"],
904
- "vehicleInformation": ["onInformationUpdate"],
905
- "state": ["loadingListener"]
906
- }; }
907
- };
908
- VehiclePaintThickness.style = vehiclePaintThicknessCss;
909
-
910
- const vehicleServiceHistoryCss = "@tailwind base;@tailwind utilities;@tailwind components;.shift-skeleton{border-radius:4px!important;position:relative!important}.loading .shift-skeleton,.loading.shift-skeleton{overflow:hidden!important;pointer-events:none!important;position:relative!important}.shift-skeleton:after{background:linear-gradient(-45deg,#d4d8de,#e2e5e9,#d4d8de);background-size:300% 300%;border-radius:4px!important;content:\"\";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transform-origin:left;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:10}.loading .shift-skeleton:after,.loading.shift-skeleton:after{--tw-scale-x:1;animation:shimmer 2s ease-in-out infinite;opacity:1;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))}@keyframes shimmer{0%{background-position:100% 0}50%{background-position:0 100%}to{background-position:100% 0}}*,: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}.invisible{visibility:hidden}.absolute{position:absolute}.\\!relative{position:relative!important}.relative{position:relative}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.block{display:block}.flex{display:flex}.h-\\[54px\\]{height:54px}.origin-left{transform-origin:left}.scale-\\[1\\.5\\]{--tw-scale-x:1.5;--tw-scale-y:1.5;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-hidden{overflow:hidden!important}.overflow-hidden{overflow:hidden}.\\!rounded-\\[4px\\]{border-radius:4px!important}.rounded-\\[5px\\]{border-radius:5px}.border{border-width:1px}.border-\\[\\#dcdcdc\\]{--tw-border-opacity:1;border-color:rgb(220 220 220/var(--tw-border-opacity,1))}.border-\\[\\#ededed\\]{--tw-border-opacity:1;border-color:rgb(237 237 237/var(--tw-border-opacity,1))}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.bg-\\[\\#fdfdfd\\]{--tw-bg-opacity:1;background-color:rgb(253 253 253/var(--tw-bg-opacity,1))}.p-0{padding:0}.text-center{text-align:center}.text-\\[16px\\]{font-size:16px}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow-\\[inset_0_1px_3px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.05\\)\\2c 0_1px_0_rgba\\(255\\2c 255\\2c 255\\2c 0\\.1\\)\\]{--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 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{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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-\\[0\\.4s\\]{transition-duration:.4s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-container{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 var(--tw-shadow-color);background-color:rgb(253 253 253/var(--tw-bg-opacity,1));border-color:rgb(220 220 220/var(--tw-border-opacity,1));border-radius:5px;border-width:1px;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);overflow:hidden;padding:0;position:relative;transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}::-webkit-scrollbar{height:10px;width:10px}::-webkit-scrollbar-track{background:#f6f6f6;border-radius:5px;border-top:1px solid #dcdcdc;border-top-left-radius:0;border-top-right-radius:0}::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.hide-scroll ::-webkit-scrollbar-thumb,.hide-scroll::-webkit-scrollbar-thumb,.loading ::-webkit-scrollbar-thumb{background:transparent}.vehicle-info-body{display:flex;flex-direction:column;overflow:hidden;position:relative;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-content{transition-duration:.3s;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);width:100%}.vehicle-info-header{--tw-border-opacity:1;--tw-bg-opacity:1;align-items:center;background-color:rgb(246 246 246/var(--tw-bg-opacity,1));border-color:rgb(237 237 237/var(--tw-border-opacity,1));border-width:1px;display:flex;height:54px;justify-content:center;text-align:center}.vehicle-info-header-vin{display:inline-block;font-size:16px;transition-duration:.15s;transition-duration:.4s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-header-vin span{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.loading .vehicle-info-header-vin{--tw-scale-x:1.5;--tw-scale-y:1.5;opacity: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));visibility:hidden}:host{all:initial!important;display:block}*{font-family:Arial}.static{position:static}.h-\\[200px\\]{height:200px}.w-full{width:100%}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.z-40{z-index:40}.float-right{float:right}.mx-auto{margin-left:auto;margin-right:auto}.mr-\\[16px\\]{margin-right:16px}.mt-\\[16px\\]{margin-top:16px}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-\\[84px\\]{width:84px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.shrink-0{flex-shrink:0}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.cursor-pointer{cursor:pointer}.flex-wrap{flex-wrap:wrap}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border-b{border-bottom-width:1px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.font-semibold{font-weight:600}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.delay-200{transition-delay:.2s}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.hidden{display:none}.grow{flex-grow:1}.items-stretch{align-items:stretch}.overflow-auto{overflow:auto}.p-\\[16px\\]{padding:16px}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.mt-\\[32px\\]{margin-top:32px}.h-\\[25px\\]{height:25px}.h-\\[50px\\]{height:50px}.h-\\[8px\\]{height:8px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.pt-\\[16px\\]{padding-top:16px}.pt-\\[40px\\]{padding-top:40px}.text-\\[18px\\]{font-size:18px}.font-bold{font-weight:700}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}";
911
-
912
- let mockData$2 = {};
913
- const VehicleServiceHistory = class {
914
- constructor(hostRef) {
915
- registerInstance(this, hostRef);
916
- this.baseUrl = '';
917
- this.isDev = false;
918
- this.queryString = '';
919
- this.coreOnly = false;
920
- this.language = 'en';
921
- this.sharedLocales = sharedLocalesSchema.getDefault();
922
- this.locale = ServiceHistorySchema.getDefault();
923
- this.state = 'idle';
924
- this.externalVin = null;
925
- this.errorMessage = null;
926
- }
927
- async componentWillLoad() {
928
- await this.changeLanguage(this.language);
929
- }
930
- async changeLanguage(newLanguage) {
931
- const localeResponses = await Promise.all([getLocaleLanguage(newLanguage, 'vehicleLookup.serviceHistory', ServiceHistorySchema), getSharedLocal(newLanguage)]);
932
- this.locale = localeResponses[0];
933
- this.sharedLocales = localeResponses[1];
934
- }
935
- handleSettingData(response) {
936
- if (response.serviceHistory === null)
937
- response.serviceHistory = [];
938
- this.vehicleInformation = response;
939
- }
940
- async setData(newData, headers = {}) {
941
- clearTimeout(this.networkTimeoutRef);
942
- if (this.abortController)
943
- this.abortController.abort();
944
- this.abortController = new AbortController();
945
- let scopedTimeoutRef;
946
- const isVinRequest = typeof newData === 'string';
947
- const vin = isVinRequest ? newData : newData === null || newData === void 0 ? void 0 : newData.vin;
948
- this.externalVin = vin;
949
- try {
950
- if (!vin || vin.trim().length === 0) {
951
- this.state = 'idle';
952
- return;
953
- }
954
- if (this.state === 'data' || this.state === 'error') {
955
- this.state = (this.state + '-loading');
956
- }
957
- else
958
- this.state = 'loading';
959
- await new Promise(r => {
960
- scopedTimeoutRef = setTimeout(r, 700);
961
- this.networkTimeoutRef = scopedTimeoutRef;
962
- });
963
- const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$2 }, headers) : newData;
964
- if (this.networkTimeoutRef === scopedTimeoutRef) {
965
- if (!vehicleResponse)
966
- throw new Error('wrongResponseFormat');
967
- this.handleSettingData(vehicleResponse);
968
- }
969
- this.errorMessage = null;
970
- this.state = 'data';
971
- }
972
- catch (error) {
973
- if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
974
- return;
975
- if (this.errorCallback)
976
- this.errorCallback(error.message);
977
- console.error(error);
978
- this.setErrorMessage(error.message);
979
- }
980
- }
981
- async setErrorMessage(message) {
982
- this.state = 'error';
983
- this.vehicleInformation = null;
984
- this.errorMessage = message;
985
- }
986
- async fetchData(requestedVin = this.externalVin, headers = {}) {
987
- await this.setData(requestedVin, headers);
988
- }
989
- async loadingListener() {
990
- if (this.loadingStateChange)
991
- this.loadingStateChange(this.state.includes('loading'));
992
- }
993
- async setMockData(newMockData) {
994
- mockData$2 = newMockData;
995
- }
996
- render() {
997
- var _a, _b;
998
- const texts = this.locale;
999
- const isLoading = this.state.includes('loading');
1000
- const isError = this.state.includes('error');
1001
- const tableHeaders = [
1002
- {
1003
- width: 400,
1004
- key: 'branchName',
1005
- label: texts.branch,
1006
- },
1007
- {
1008
- width: 200,
1009
- key: 'companyName',
1010
- label: texts.dealer,
1011
- },
1012
- {
1013
- width: 200,
1014
- key: 'invoiceNumber',
1015
- label: texts.invoiceNumber,
1016
- },
1017
- {
1018
- width: 200,
1019
- key: 'serviceDate',
1020
- label: texts.date,
1021
- },
1022
- {
1023
- width: 400,
1024
- key: 'serviceType',
1025
- label: texts.serviceType,
1026
- },
1027
- {
1028
- width: 200,
1029
- key: 'mileage',
1030
- label: texts.odometer,
1031
- },
1032
- ];
1033
- return (h(Host, { key: '5eb3927b6b36c1c1fa5fa607891b55389253c7ce' }, h(VehicleInfoLayout, { key: 'fe8b1ee4b20765a16768765e082d10c329bdb58c', isError: isError, isLoading: isLoading, coreOnly: this.coreOnly, vin: (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vin, direction: this.sharedLocales.direction, errorMessage: this.sharedLocales.errors[this.errorMessage] || this.sharedLocales.errors.wildCard }, h("div", { key: '4b8ced24df8852152a63c140ee585126679689cd', class: "overflow-x-auto" }, h("information-table", { key: '69d7209ace58e6c151085e898354acbc833edf4a', rows: ((_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.serviceHistory) || [], headers: tableHeaders, isLoading: isLoading })))));
1034
- }
1035
- get el() { return getElement(this); }
1036
- static get watchers() { return {
1037
- "language": ["changeLanguage"],
1038
- "state": ["loadingListener"]
1039
- }; }
1040
- };
1041
- VehicleServiceHistory.style = vehicleServiceHistoryCss;
1042
-
1043
- const MaterialCard = (props, children = []) => {
1044
- var _a;
1045
- const wrapperStyle = {
1046
- flex: '1',
1047
- display: 'flex',
1048
- width: props.class,
1049
- flexDirection: 'column',
1050
- minWidth: props.minWidth,
1051
- maxWidth: props.maxWidth,
1052
- };
1053
- const titleStyle = {
1054
- padding: '10px 0',
1055
- fontWeight: 'bold',
1056
- marginBottom: '8px',
1057
- borderBottom: '1px solid gray',
1058
- };
1059
- return (h("div", { style: wrapperStyle, class: props.class },
1060
- h("strong", { style: titleStyle }, props.title),
1061
- h("flexible-container", null, !children.length ? h(MaterialCardChildren, { hidden: ['...', ''].includes((_a = props === null || props === void 0 ? void 0 : props.desc) === null || _a === void 0 ? void 0 : _a.trim()) }, props.desc || '...') : children)));
1062
- };
1063
- const MaterialCardChildren = (props, children) => {
1064
- const wrapperStyles = {
1065
- width: '100%',
1066
- };
1067
- const contentStyles = {
1068
- 'transition-duration': '0ms !important',
1069
- 'opacity': props.hidden ? '0' : '1',
1070
- };
1071
- return (h("div", { style: wrapperStyles, class: cn('shift-skeleton', props.class) },
1072
- h("div", { style: contentStyles }, children)));
1073
- };
1074
-
1075
- const vehicleSpecificationCss = "@tailwind base;@tailwind utilities;@tailwind components;.shift-skeleton{border-radius:4px!important;position:relative!important}.loading .shift-skeleton,.loading.shift-skeleton{overflow:hidden!important;pointer-events:none!important;position:relative!important}.shift-skeleton:after{background:linear-gradient(-45deg,#d4d8de,#e2e5e9,#d4d8de);background-size:300% 300%;border-radius:4px!important;content:\"\";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transform-origin:left;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:10}.loading .shift-skeleton:after,.loading.shift-skeleton:after{--tw-scale-x:1;animation:shimmer 2s ease-in-out infinite;opacity:1;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))}@keyframes shimmer{0%{background-position:100% 0}50%{background-position:0 100%}to{background-position:100% 0}}*,: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}.invisible{visibility:hidden}.absolute{position:absolute}.\\!relative{position:relative!important}.relative{position:relative}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.block{display:block}.flex{display:flex}.h-\\[54px\\]{height:54px}.origin-left{transform-origin:left}.scale-\\[1\\.5\\]{--tw-scale-x:1.5;--tw-scale-y:1.5;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-hidden{overflow:hidden!important}.overflow-hidden{overflow:hidden}.\\!rounded-\\[4px\\]{border-radius:4px!important}.rounded-\\[5px\\]{border-radius:5px}.border{border-width:1px}.border-\\[\\#dcdcdc\\]{--tw-border-opacity:1;border-color:rgb(220 220 220/var(--tw-border-opacity,1))}.border-\\[\\#ededed\\]{--tw-border-opacity:1;border-color:rgb(237 237 237/var(--tw-border-opacity,1))}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.bg-\\[\\#fdfdfd\\]{--tw-bg-opacity:1;background-color:rgb(253 253 253/var(--tw-bg-opacity,1))}.p-0{padding:0}.text-center{text-align:center}.text-\\[16px\\]{font-size:16px}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow-\\[inset_0_1px_3px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.05\\)\\2c 0_1px_0_rgba\\(255\\2c 255\\2c 255\\2c 0\\.1\\)\\]{--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 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{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)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-\\[0\\.4s\\]{transition-duration:.4s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-container{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 var(--tw-shadow-color);background-color:rgb(253 253 253/var(--tw-bg-opacity,1));border-color:rgb(220 220 220/var(--tw-border-opacity,1));border-radius:5px;border-width:1px;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);overflow:hidden;padding:0;position:relative;transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}::-webkit-scrollbar{height:10px;width:10px}::-webkit-scrollbar-track{background:#f6f6f6;border-radius:5px;border-top:1px solid #dcdcdc;border-top-left-radius:0;border-top-right-radius:0}::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.hide-scroll ::-webkit-scrollbar-thumb,.hide-scroll::-webkit-scrollbar-thumb,.loading ::-webkit-scrollbar-thumb{background:transparent}.vehicle-info-body{display:flex;flex-direction:column;overflow:hidden;position:relative;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-content{transition-duration:.3s;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);width:100%}.vehicle-info-header{--tw-border-opacity:1;--tw-bg-opacity:1;align-items:center;background-color:rgb(246 246 246/var(--tw-bg-opacity,1));border-color:rgb(237 237 237/var(--tw-border-opacity,1));border-width:1px;display:flex;height:54px;justify-content:center;text-align:center}.vehicle-info-header-vin{display:inline-block;font-size:16px;transition-duration:.15s;transition-duration:.4s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-header-vin span{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.loading .vehicle-info-header-vin{--tw-scale-x:1.5;--tw-scale-y:1.5;opacity: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));visibility:hidden}:host{all:initial!important;display:block}*{font-family:Arial}.static{position:static}.h-\\[200px\\]{height:200px}.w-full{width:100%}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.z-40{z-index:40}.float-right{float:right}.mx-auto{margin-left:auto;margin-right:auto}.mr-\\[16px\\]{margin-right:16px}.mt-\\[16px\\]{margin-top:16px}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-\\[84px\\]{width:84px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.shrink-0{flex-shrink:0}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.cursor-pointer{cursor:pointer}.flex-wrap{flex-wrap:wrap}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border-b{border-bottom-width:1px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.font-semibold{font-weight:600}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.delay-200{transition-delay:.2s}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.hidden{display:none}.grow{flex-grow:1}.items-stretch{align-items:stretch}.overflow-auto{overflow:auto}.p-\\[16px\\]{padding:16px}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.mt-\\[32px\\]{margin-top:32px}.h-\\[25px\\]{height:25px}.h-\\[50px\\]{height:50px}.h-\\[8px\\]{height:8px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.pt-\\[16px\\]{padding-top:16px}.pt-\\[40px\\]{padding-top:40px}.text-\\[18px\\]{font-size:18px}.font-bold{font-weight:700}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}";
1076
-
1077
- let mockData$1 = {};
1078
- const VehicleSpecification = class {
1079
- constructor(hostRef) {
1080
- registerInstance(this, hostRef);
1081
- this.baseUrl = '';
1082
- this.isDev = false;
1083
- this.queryString = '';
1084
- this.coreOnly = false;
1085
- this.language = 'en';
1086
- this.sharedLocales = sharedLocalesSchema.getDefault();
1087
- this.locale = specificationSchema.getDefault();
1088
- this.state = 'idle';
1089
- this.externalVin = null;
1090
- this.errorMessage = null;
1091
- }
1092
- async componentWillLoad() {
1093
- await this.changeLanguage(this.language);
1094
- }
1095
- async changeLanguage(newLanguage) {
1096
- const localeResponses = await Promise.all([getLocaleLanguage(newLanguage, 'vehicleLookup.specification', specificationSchema), getSharedLocal(newLanguage)]);
1097
- this.locale = localeResponses[0];
1098
- this.sharedLocales = localeResponses[1];
1099
- }
1100
- async setData(newData, headers = {}) {
1101
- clearTimeout(this.networkTimeoutRef);
1102
- if (this.abortController)
1103
- this.abortController.abort();
1104
- this.abortController = new AbortController();
1105
- let scopedTimeoutRef;
1106
- const isVinRequest = typeof newData === 'string';
1107
- const vin = isVinRequest ? newData : newData === null || newData === void 0 ? void 0 : newData.vin;
1108
- this.externalVin = vin;
1109
- try {
1110
- if (!vin || vin.trim().length === 0) {
1111
- this.state = 'idle';
1112
- return;
1113
- }
1114
- if (this.state === 'data' || this.state === 'error') {
1115
- this.state = (this.state + '-loading');
1116
- }
1117
- else
1118
- this.state = 'loading';
1119
- await new Promise(r => {
1120
- scopedTimeoutRef = setTimeout(r, 700);
1121
- this.networkTimeoutRef = scopedTimeoutRef;
1122
- });
1123
- const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData: mockData$1 }, headers) : newData;
1124
- if (this.networkTimeoutRef === scopedTimeoutRef) {
1125
- if (!vehicleResponse)
1126
- throw new Error('wrongResponseFormat');
1127
- this.vehicleInformation = vehicleResponse;
1128
- }
1129
- this.errorMessage = null;
1130
- this.state = 'data';
1131
- }
1132
- catch (error) {
1133
- if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
1134
- return;
1135
- if (this.errorCallback)
1136
- this.errorCallback(error.message);
1137
- console.error(error);
1138
- this.setErrorMessage(error.message);
1139
- }
1140
- }
1141
- async setErrorMessage(message) {
1142
- this.state = 'error';
1143
- this.vehicleInformation = null;
1144
- this.errorMessage = message;
1145
- }
1146
- async fetchData(requestedVin = this.externalVin, headers = {}) {
1147
- await this.setData(requestedVin, headers);
1148
- }
1149
- async loadingListener() {
1150
- if (this.loadingStateChange)
1151
- this.loadingStateChange(this.state.includes('loading'));
1152
- }
1153
- async setMockData(newMockData) {
1154
- mockData$1 = newMockData;
1155
- }
1156
- render() {
1157
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14;
1158
- const texts = this.locale;
1159
- let productionDate = null;
1160
- try {
1161
- if ((_b = (_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.vehicleSpecification) === null || _b === void 0 ? void 0 : _b.productionDate) {
1162
- const productionDateObj = new Date((_d = (_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.vehicleSpecification) === null || _d === void 0 ? void 0 : _d.productionDate);
1163
- productionDate = productionDateObj.toLocaleDateString(this.sharedLocales.language, {
1164
- year: 'numeric',
1165
- month: 'long',
1166
- });
1167
- }
1168
- }
1169
- catch (error) {
1170
- productionDate = null;
1171
- }
1172
- const isLoading = this.state.includes('loading');
1173
- const isError = this.state.includes('error');
1174
- return (h(Host, { key: '863b3f6d3ed1c3ea0dfefc3887077e385d0d7d71' }, h(VehicleInfoLayout, { key: 'f38e7f4b6af4450669dfa1492c1cdf8a3f2dda51', isError: isError, isLoading: isLoading, coreOnly: this.coreOnly, vin: (_e = this.vehicleInformation) === null || _e === void 0 ? void 0 : _e.vin, direction: this.sharedLocales.direction, errorMessage: this.sharedLocales.errors[this.errorMessage] || this.sharedLocales.errors.wildCard }, h("flexible-container", { key: '611abb8a37f1f9944a98e96385873f278ec3c704' }, h("div", { key: 'cd8625253b8e5e74957ce17ae330c156f2731808', class: "flex p-[16px] [&>div]:grow overflow-auto gap-[16px] items-stretch justify-center md:justify-between flex-wrap" }, h(MaterialCard, { key: 'ee0be608d2f2ce20b788cc7722d22c715b74ecf5', class: "grow", title: texts === null || texts === void 0 ? void 0 : texts.model, minWidth: "300px" }, h(MaterialCardChildren, { key: 'f854b24d7569b8f0665ef75d56902c14ae83d130', class: "text-center", hidden: !((_h = (_g = (_f = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _f === void 0 ? void 0 : _f.vehicleVariantInfo) === null || _g === void 0 ? void 0 : _g.modelCode) === null || _h === void 0 ? void 0 : _h.trim()) && !((_l = (_k = (_j = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _j === void 0 ? void 0 : _j.vehicleSpecification) === null || _k === void 0 ? void 0 : _k.modelDescription) === null || _l === void 0 ? void 0 : _l.trim()) }, ((_p = (_o = (_m = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _m === void 0 ? void 0 : _m.vehicleVariantInfo) === null || _o === void 0 ? void 0 : _o.modelCode) === null || _p === void 0 ? void 0 : _p.trim()) || '...', " ", h("br", { key: 'd7a1ac0fe1dd88df25aa0be22d10c6c51b448007', class: "my-2" }), ((_s = (_r = (_q = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _q === void 0 ? void 0 : _q.vehicleSpecification) === null || _r === void 0 ? void 0 : _r.modelDescription) === null || _s === void 0 ? void 0 : _s.trim()) || '...')), h(MaterialCard, { key: '1765b30393fb3eacf790ed58e8f8ab397a351f7d', class: "grow", title: texts === null || texts === void 0 ? void 0 : texts.variant, minWidth: "300px" }, h(MaterialCardChildren, { key: '3c6fe5b2d6f0a450136e5da3494e39459a18de2b', class: "text-center", hidden: !((_v = (_u = (_t = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _t === void 0 ? void 0 : _t.identifiers) === null || _u === void 0 ? void 0 : _u.variant) === null || _v === void 0 ? void 0 : _v.trim()) && !((_y = (_x = (_w = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _w === void 0 ? void 0 : _w.vehicleSpecification) === null || _x === void 0 ? void 0 : _x.variantDescription) === null || _y === void 0 ? void 0 : _y.trim()) }, ((_1 = (_0 = (_z = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _z === void 0 ? void 0 : _z.identifiers) === null || _0 === void 0 ? void 0 : _0.variant) === null || _1 === void 0 ? void 0 : _1.trim()) || '...', " ", h("br", { key: '79ed2de9b07475871a451de5383cba964da9e01a' }), ((_4 = (_3 = (_2 = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _2 === void 0 ? void 0 : _2.vehicleSpecification) === null || _3 === void 0 ? void 0 : _3.variantDescription) === null || _4 === void 0 ? void 0 : _4.trim()) || '...')), h(MaterialCard, { key: 'e3102ca4529a36e3362a6ae19cff1ae60084c7c1', desc: ((_7 = (_6 = (_5 = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _5 === void 0 ? void 0 : _5.identifiers) === null || _6 === void 0 ? void 0 : _6.katashiki) === null || _7 === void 0 ? void 0 : _7.trim()) || '...', title: texts === null || texts === void 0 ? void 0 : texts.katashiki, minWidth: "250px" }), h(MaterialCard, { key: '0c0040ce51cb6918b64552037ef53a7700090b5a', desc: ((_11 = (_10 = (_9 = (_8 = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _8 === void 0 ? void 0 : _8.vehicleVariantInfo) === null || _9 === void 0 ? void 0 : _9.modelYear) === null || _10 === void 0 ? void 0 : _10.toString()) === null || _11 === void 0 ? void 0 : _11.trim()) || '...', title: texts === null || texts === void 0 ? void 0 : texts.modelYear, minWidth: "250px" }), h(MaterialCard, { key: 'a12d374ebd194ea4da8ff52aacd07f9d089a8aef', desc: !!productionDate ? productionDate : '...', title: texts === null || texts === void 0 ? void 0 : texts.productionDate, minWidth: "250px" }), h(MaterialCard, { key: 'f45f31b5b372a500de26763e29999f886ca88a81', desc: ((_14 = (_13 = (_12 = this === null || this === void 0 ? void 0 : this.vehicleInformation) === null || _12 === void 0 ? void 0 : _12.vehicleVariantInfo) === null || _13 === void 0 ? void 0 : _13.sfx) === null || _14 === void 0 ? void 0 : _14.trim()) || '...', title: texts === null || texts === void 0 ? void 0 : texts.sfx, minWidth: "250px" }))))));
1175
- }
1176
- get el() { return getElement(this); }
1177
- static get watchers() { return {
1178
- "language": ["changeLanguage"],
1179
- "state": ["loadingListener"]
1180
- }; }
1181
- };
1182
- VehicleSpecification.style = vehicleSpecificationCss;
1183
-
1184
- const checkSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj4KICAgIDxwYXRoIGZpbGw9IiMwYjM1MjEiCiAgICAgICAgZD0iTTI1NiA1MTJBMjU2IDI1NiAwIDEgMCAyNTYgMGEyNTYgMjU2IDAgMSAwIDAgNTEyek0zNjkgMjA5TDI0MSAzMzdjLTkuNCA5LjQtMjQuNiA5LjQtMzMuOSAwbC02NC02NGMtOS40LTkuNC05LjQtMjQuNiAwLTMzLjlzMjQuNi05LjQgMzMuOSAwbDQ3IDQ3TDMzNSAxNzVjOS40LTkuNCAyNC42LTkuNCAzMy45IDBzOS40IDI0LjYgMCAzMy45eiIgLz4KPC9zdmc+';
1185
-
1186
- const xMarkSvg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj4KICAgIDxwYXRoIGZpbGw9IiM1ODE1MWMiCiAgICAgICAgZD0iTTI1NiA1MTJBMjU2IDI1NiAwIDEgMCAyNTYgMGEyNTYgMjU2IDAgMSAwIDAgNTEyek0xNzUgMTc1YzkuNC05LjQgMjQuNi05LjQgMzMuOSAwbDQ3IDQ3IDQ3LTQ3YzkuNC05LjQgMjQuNi05LjQgMzMuOSAwczkuNCAyNC42IDAgMzMuOWwtNDcgNDcgNDcgNDdjOS40IDkuNCA5LjQgMjQuNiAwIDMzLjlzLTI0LjYgOS40LTMzLjkgMGwtNDctNDctNDcgNDdjLTkuNCA5LjQtMjQuNiA5LjQtMzMuOSAwcy05LjQtMjQuNiAwLTMzLjlsNDctNDctNDctNDdjLTkuNC05LjQtOS40LTI0LjYgMC0zMy45eiIgLz4KPC9zdmc+';
1187
-
1188
- function StatusCard({ isLoading = false, opened = true, desc, className, fromDesc, toDesc, from, to, state = 'idle', icon = true }) {
1189
- return (h("flexible-container", { isOpened: opened, classes: cn('shift-skeleton', { loading: isLoading || !opened }) },
1190
- h("div", { class: cn('card', className, `${state}-card`) },
1191
- icon && state === 'reject' && h("img", { src: xMarkSvg }),
1192
- icon && state === 'warning' && h("img", { src: xMarkSvg }),
1193
- icon && state === 'success' && h("img", { src: checkSvg }),
1194
- from && (h("p", { class: "no-padding flex gap-2" },
1195
- h("span", { class: "font-semibold" },
1196
- fromDesc,
1197
- ":"),
1198
- " ",
1199
- desc)),
1200
- to && (h("p", { class: "no-padding flex gap-2" },
1201
- h("span", { class: "font-semibold" },
1202
- toDesc,
1203
- ":"),
1204
- " ",
1205
- desc)),
1206
- !from && !to && h("p", { class: state === 'idle' ? 'no-padding' : '' }, desc))));
1207
- }
1208
-
1209
- function CardsContainer({ isLoading, vehicleInformation, isAuthorized, unInvoicedByBrokerName, warrantyLocale }) {
1210
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
1211
- return (h("div", { class: "tags-container mx-auto" },
1212
- h("flexible-container", { isOpened: !vehicleInformation || !!((_a = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _a === void 0 ? void 0 : _a.companyName) },
1213
- h("div", { class: !(!vehicleInformation || !!((_b = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _b === void 0 ? void 0 : _b.companyName)) && 'loading', style: { paddingBottom: '12px' } },
1214
- h("div", { class: "shift-skeleton !rounded-[4px]" },
1215
- h("div", { class: "card warning-card" },
1216
- h("p", { class: "no-padding flex gap-2" },
1217
- h("span", { class: "font-semibold" },
1218
- warrantyLocale.dealer,
1219
- ":"),
1220
- " ",
1221
- ((_c = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _c === void 0 ? void 0 : _c.companyName) || '',
1222
- ' ',
1223
- ((_d = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _d === void 0 ? void 0 : _d.countryName) && `(${(_e = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.saleInformation) === null || _e === void 0 ? void 0 : _e.countryName})`))))),
1224
- h("flexible-container", { classes: cn({ loading: isLoading || !unInvoicedByBrokerName }), isOpened: !!unInvoicedByBrokerName },
1225
- h("div", { style: { paddingBottom: '12px' } },
1226
- h("div", { class: "shift-skeleton" },
1227
- h("div", { class: "card warning-card" },
1228
- h("img", { src: xMarkSvg }),
1229
- h("p", null, unInvoicedByBrokerName ? warrantyLocale.notInvoiced + unInvoicedByBrokerName : ''))))),
1230
- h("div", { class: "warranty-tags" },
1231
- h(StatusCard, { state: vehicleInformation ? (isAuthorized ? 'success' : 'reject') : 'idle', desc: vehicleInformation ? (isAuthorized ? warrantyLocale.authorized : warrantyLocale.unauthorized) : '' }),
1232
- h(StatusCard, { state: vehicleInformation ? (((_f = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _f === void 0 ? void 0 : _f.hasActiveWarranty) ? 'success' : 'reject') : 'idle', desc: vehicleInformation ? (((_g = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _g === void 0 ? void 0 : _g.hasActiveWarranty) ? warrantyLocale.activeWarranty : warrantyLocale.notActiveWarranty) : '' }),
1233
- h(StatusCard, { from: true, icon: false, fromDesc: warrantyLocale.from, desc: ((_h = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _h === void 0 ? void 0 : _h.warrantyStartDate) || '', opened: !!((_j = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _j === void 0 ? void 0 : _j.warrantyStartDate) || !vehicleInformation, state: !!vehicleInformation ? (((_k = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _k === void 0 ? void 0 : _k.hasActiveWarranty) ? 'success' : 'reject') : 'idle' }),
1234
- h(StatusCard, { to: true, icon: false, toDesc: warrantyLocale.to, desc: ((_l = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _l === void 0 ? void 0 : _l.warrantyEndDate) || '', opened: !!((_m = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _m === void 0 ? void 0 : _m.warrantyEndDate) || !vehicleInformation, state: !!vehicleInformation ? (((_o = vehicleInformation === null || vehicleInformation === void 0 ? void 0 : vehicleInformation.warranty) === null || _o === void 0 ? void 0 : _o.hasActiveWarranty) ? 'success' : 'reject') : 'idle' }))));
1235
- }
1236
-
1237
- const vehicleWarrantyDetailsCss = "@tailwind base;@tailwind utilities;@tailwind components;.shift-skeleton{border-radius:4px!important;position:relative!important}.loading .shift-skeleton,.loading.shift-skeleton{overflow:hidden!important;pointer-events:none!important;position:relative!important}.shift-skeleton:after{background:linear-gradient(-45deg,#d4d8de,#e2e5e9,#d4d8de);background-size:300% 300%;border-radius:4px!important;content:\"\";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transform-origin:left;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:10}.loading .shift-skeleton:after,.loading.shift-skeleton:after{--tw-scale-x:1;animation:shimmer 2s ease-in-out infinite;opacity:1;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))}@keyframes shimmer{0%{background-position:100% 0}50%{background-position:0 100%}to{background-position:100% 0}}*,: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}.invisible{visibility:hidden}.collapse{visibility:collapse}.absolute{left:0;position:absolute;top:0}.\\!relative{position:relative!important}.relative{position:relative}.sticky{position:sticky}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.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;height:0!important}.h-\\[54px\\]{height:54px}.flex-shrink{flex-shrink:1}.border-collapse{border-collapse:collapse}.origin-left{transform-origin:left}.scale-\\[1\\.5\\]{--tw-scale-x:1.5;--tw-scale-y:1.5;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}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.\\!overflow-hidden{overflow:hidden!important}.overflow-hidden{overflow:hidden}.\\!rounded-\\[4px\\]{border-radius:4px!important}.rounded-\\[5px\\]{border-radius:5px}.border{border-width:1px}.border-\\[\\#dcdcdc\\]{--tw-border-opacity:1;border-color:rgb(220 220 220/var(--tw-border-opacity,1))}.border-\\[\\#ededed\\]{--tw-border-opacity:1;border-color:rgb(237 237 237/var(--tw-border-opacity,1))}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.bg-\\[\\#fdfdfd\\]{--tw-bg-opacity:1;background-color:rgb(253 253 253/var(--tw-bg-opacity,1))}.p-0{padding:0}.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}.text-center{text-align:center}.text-\\[16px\\]{font-size:16px}.font-semibold{font-weight:600}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow-\\[inset_0_1px_3px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.05\\)\\2c 0_1px_0_rgba\\(255\\2c 255\\2c 255\\2c 0\\.1\\)\\]{--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 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{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);transition:all;transition-duration:.3s}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-1000{transition-duration:1s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-700{transition-duration:.7s}.duration-\\[0\\.4s\\]{transition-duration:.4s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.success-card{background:#d0e7de!important;background-color:#d0e7de;border-color:#a2d0bb!important;border-color:#a2d0bb;color:#0b3521!important;color:#0b3521}.reject-card{background:#f7d7d8!important;background-color:#f7d7d8;border-color:#f2aeb5!important;border-color:#f2aeb5;color:#58151c!important;color:#58151c}.vehicle-info-container{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 hsla(0,0%,100%,.1);--tw-shadow-colored:inset 0 1px 3px var(--tw-shadow-color),0 1px 0 var(--tw-shadow-color);background-color:rgb(253 253 253/var(--tw-bg-opacity,1));border-color:rgb(220 220 220/var(--tw-border-opacity,1));border-radius:5px;border-width:1px;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);overflow:hidden;padding:0;position:relative;transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}::-webkit-scrollbar{height:10px;width:10px}::-webkit-scrollbar-track{background:#f6f6f6;border-radius:5px;border-top:1px solid #dcdcdc;border-top-left-radius:0;border-top-right-radius:0}::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.hide-scroll ::-webkit-scrollbar-thumb,.hide-scroll::-webkit-scrollbar-thumb,.loading ::-webkit-scrollbar-thumb{background:transparent}.vehicle-info-body{display:flex;flex-direction:column;overflow:hidden;position:relative;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-content{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);transition:all;transition-duration:.3s;width:100%}.vehicle-info-header{--tw-border-opacity:1;--tw-bg-opacity:1;align-items:center;background-color:rgb(246 246 246/var(--tw-bg-opacity,1));border-color:rgb(237 237 237/var(--tw-border-opacity,1));border-width:1px;display:flex;height:54px;justify-content:center;text-align:center}.vehicle-info-header-vin{display:inline-block;font-size:16px;transition-duration:.15s;transition-duration:.4s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.vehicle-info-header-vin span{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.loading .vehicle-info-header-vin{--tw-scale-x:1.5;--tw-scale-y:1.5;opacity: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));visibility:hidden}:host{all:initial!important;display:block}*{font-family:Arial}@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}.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{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1));border:1px solid;border-color:rgb(203 213 225/var(--tw-border-opacity,1));border-radius:6px;color:rgb(15 23 42/var(--tw-text-opacity,1));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-1st-row{grid-column:1/3;grid-row:1/3}.span-entire-2nd-row{grid-column:1/3;grid-row:2/3}.tags-container,.warranty-tags{max-width:1000px}.warranty-tags{display:grid;gap:12px;grid-template-columns:1fr 1fr}.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-labors-container,.table-cell-parts-container{flex-wrap:wrap}.table-cell-labors-container div,.table-cell-parts-container div{border-radius:4px;font-size:14px;padding:4px 8px}.table-cell-labors-container div.success,.table-cell-parts-container div.success{background:#d0e7de}.table-cell-labors-container div.reject,.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}.h-\\[200px\\]{height:200px}.w-full{width:100%}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.fixed{position:fixed}.z-40{z-index:40}.float-right{float:right}.mr-\\[16px\\]{margin-right:16px}.mt-\\[16px\\]{margin-top:16px}.size-12{height:3rem;width:3rem}.size-full{height:100%;width:100%}.h-1{height:.25rem}.h-\\[100dvh\\]{height:100dvh}.h-\\[150px\\]{height:150px}.w-12{width:3rem}.w-\\[100dvw\\]{width:100dvw}.w-\\[84px\\]{width:84px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.shrink-0{flex-shrink:0}.-rotate-45{--tw-rotate:-45deg}.-rotate-45,.rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.cursor-pointer{cursor:pointer}.gap-\\[16px\\]{gap:16px}.gap-\\[4px\\]{gap:4px}.gap-\\[8px\\]{gap:8px}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border-b{border-bottom-width:1px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.delay-200{transition-delay:.2s}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.grow{flex-grow:1}.items-stretch{align-items:stretch}.overflow-auto{overflow:auto}.p-\\[16px\\]{padding:16px}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.mt-\\[32px\\]{margin-top:32px}.h-\\[25px\\]{height:25px}.h-\\[50px\\]{height:50px}.h-\\[8px\\]{height:8px}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.pt-\\[16px\\]{padding-top:16px}.pt-\\[40px\\]{padding-top:40px}.text-\\[18px\\]{font-size:18px}.font-bold{font-weight:700}.gap-2{gap:.5rem}";
1238
-
1239
- let mockData = {};
1240
- const VehicleWarrantyDetails = class {
1241
- constructor(hostRef) {
1242
- registerInstance(this, hostRef);
1243
- this.baseUrl = '';
1244
- this.isDev = false;
1245
- this.showSsc = false;
1246
- this.queryString = '';
1247
- this.recaptchaKey = '';
1248
- this.coreOnly = false;
1249
- this.language = 'en';
1250
- this.showWarranty = false;
1251
- this.unauthorizedSscLookupBaseUrl = '';
1252
- this.unauthorizedSscLookupQueryString = '';
1253
- this.cityId = null;
1254
- this.cityIntegrationId = null;
1255
- this.companyId = null;
1256
- this.companyIntegrationId = null;
1257
- this.companyBranchId = null;
1258
- this.companyBranchIntegrationId = null;
1259
- this.userId = null;
1260
- this.brandIntegrationId = null;
1261
- this.customerName = null;
1262
- this.customerPhone = null;
1263
- this.customerEmail = null;
1264
- this.state = 'idle';
1265
- this.externalVin = null;
1266
- this.showRecaptcha = false;
1267
- this.errorMessage = null;
1268
- this.unInvoicedByBrokerName = null;
1269
- this.checkingUnauthorizedSSC = false;
1270
- this.recaptchaRes = null;
1271
- this.headers = {};
1272
- this.sharedLocales = sharedLocalesSchema.getDefault();
1273
- this.locale = warrantySchema.getDefault();
1274
- }
1275
- async componentWillLoad() {
1276
- await this.changeLanguage(this.language);
1277
- }
1278
- async changeLanguage(newLanguage) {
1279
- const localeResponses = await Promise.all([getLocaleLanguage(newLanguage, 'vehicleLookup.warranty', warrantySchema), getSharedLocal(newLanguage)]);
1280
- this.locale = localeResponses[0];
1281
- this.sharedLocales = localeResponses[1];
1282
- }
1283
- handleSettingData(response) {
1284
- var _a, _b, _c;
1285
- if (response.warranty === null)
1286
- response.warranty = {
1287
- warrantyEndDate: '',
1288
- warrantyStartDate: '',
1289
- hasActiveWarranty: false,
1290
- hasExtendedWarranty: false,
1291
- extendedWarrantyEndDate: '',
1292
- extendedWarrantyStartDate: '',
1293
- };
1294
- if (response.ssc === null)
1295
- response.ssc = [];
1296
- this.unInvoicedByBrokerName = null;
1297
- if (((_a = response === null || response === void 0 ? void 0 : response.saleInformation) === null || _a === void 0 ? void 0 : _a.broker) !== null && ((_c = (_b = response === null || response === void 0 ? void 0 : response.saleInformation) === null || _b === void 0 ? void 0 : _b.broker) === null || _c === void 0 ? void 0 : _c.invoiceDate) === null)
1298
- this.unInvoicedByBrokerName = response.saleInformation.broker.brokerName;
1299
- this.vehicleInformation = response;
1300
- }
1301
- async handleInitializingRecaptcha(vin, scopedTimeoutRef) {
1302
- var _a;
1303
- if (((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.isAuthorized) === false && this.showSsc && this.recaptchaKey !== '') {
1304
- grecaptcha.reset();
1305
- // await new Promise(r => setTimeout(r, 400));
1306
- this.recaptchaIntervalRef = setInterval(async () => {
1307
- var _a;
1308
- const recaptchaResponse = grecaptcha.getResponse();
1309
- if (recaptchaResponse) {
1310
- clearInterval(this.recaptchaIntervalRef);
1311
- if (this.isDev) {
1312
- this.checkingUnauthorizedSSC = true;
1313
- this.showRecaptcha = false;
1314
- await new Promise(r => setTimeout(r, 3000));
1315
- this.checkingUnauthorizedSSC = false;
1316
- const hasPendingSSC = Math.random() < 0.5 ? false : true;
1317
- this.recaptchaRes = {
1318
- hasSSC: hasPendingSSC,
1319
- message: hasPendingSSC ? 'pendingSSC' : 'noPendingSSC',
1320
- };
1321
- }
1322
- else {
1323
- this.checkingUnauthorizedSSC = true;
1324
- this.showRecaptcha = false;
1325
- const response = await fetch(`${this.unauthorizedSscLookupBaseUrl}${vin}/${(_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.sscLogId}?${this.unauthorizedSscLookupQueryString}`, {
1326
- signal: this.abortController.signal,
1327
- headers: Object.assign(Object.assign({}, this.headers), { 'Ssc-Recaptcha-Token': recaptchaResponse }),
1328
- });
1329
- const vinResponse = await response.json();
1330
- if (vinResponse && this.networkTimeoutRef === scopedTimeoutRef) {
1331
- this.checkingUnauthorizedSSC = false;
1332
- const hasPendingSSC = vinResponse.sscLookupStatus === 1;
1333
- this.recaptchaRes = {
1334
- hasSSC: hasPendingSSC,
1335
- message: hasPendingSSC ? 'pendingSSC' : 'noPendingSSC',
1336
- };
1337
- }
1338
- else
1339
- throw new Error('wrongResponseFormat');
1340
- }
1341
- }
1342
- }, 500);
1343
- this.showRecaptcha = true;
1344
- }
1345
- else {
1346
- this.showRecaptcha = false;
1347
- }
1348
- }
1349
- async setData(newData, headers = {}) {
1350
- this.recaptchaRes = null;
1351
- this.headers = headers;
1352
- clearTimeout(this.networkTimeoutRef);
1353
- clearInterval(this.recaptchaIntervalRef);
1354
- if (this.abortController)
1355
- this.abortController.abort();
1356
- this.abortController = new AbortController();
1357
- let scopedTimeoutRef;
1358
- const isVinRequest = typeof newData === 'string';
1359
- const vin = isVinRequest ? newData : newData === null || newData === void 0 ? void 0 : newData.vin;
1360
- this.externalVin = vin;
1361
- try {
1362
- if (!vin || vin.trim().length === 0) {
1363
- this.state = 'idle';
1364
- return;
1365
- }
1366
- if (this.state === 'data' || this.state === 'error') {
1367
- this.state = (this.state + '-loading');
1368
- }
1369
- else
1370
- this.state = 'loading';
1371
- await new Promise(r => {
1372
- scopedTimeoutRef = setTimeout(r, 600);
1373
- this.networkTimeoutRef = scopedTimeoutRef;
1374
- });
1375
- const vehicleResponse = isVinRequest ? await getVehicleInformation(this, { scopedTimeoutRef, vin, mockData }, headers) : newData;
1376
- if (this.networkTimeoutRef === scopedTimeoutRef) {
1377
- if (!vehicleResponse)
1378
- throw new Error('wrongResponseFormat');
1379
- this.handleSettingData(vehicleResponse);
1380
- this.handleInitializingRecaptcha(vin, scopedTimeoutRef);
1381
- }
1382
- this.errorMessage = null;
1383
- this.state = 'data';
1384
- }
1385
- catch (error) {
1386
- if (error && (error === null || error === void 0 ? void 0 : error.name) === 'AbortError')
1387
- return;
1388
- if (this.errorCallback)
1389
- this.errorCallback(error.message);
1390
- console.error(error);
1391
- this.setErrorMessage(error.message);
1392
- }
1393
- }
1394
- async setErrorMessage(message) {
1395
- this.state = 'error';
1396
- this.vehicleInformation = null;
1397
- this.errorMessage = message;
1398
- }
1399
- async fetchData(requestedVin = this.externalVin, headers = {}) {
1400
- await this.setData(requestedVin, headers);
1401
- }
1402
- async componentDidLoad() {
1403
- if (this.recaptchaKey !== '') {
1404
- const script = document.createElement('script');
1405
- script.src = 'https://www.google.com/recaptcha/api.js';
1406
- script.async = true;
1407
- script.defer = true;
1408
- script.onload = () => console.log('reCAPTCHA script loaded');
1409
- document.head.appendChild(script);
1410
- }
1411
- }
1412
- async setMockData(newMockData) {
1413
- mockData = newMockData;
1414
- }
1415
- async loadingListener() {
1416
- if (this.loadingStateChange)
1417
- this.loadingStateChange(this.state.includes('loading'));
1418
- }
1419
- render() {
1420
- var _a, _b, _c, _d, _e, _f;
1421
- const isLoading = this.state.includes('loading');
1422
- const isError = this.state.includes('error');
1423
- const tableHeaders = [
1424
- {
1425
- width: 200,
1426
- key: 'sscTableCode',
1427
- label: this.locale.sscTableCode,
1428
- },
1429
- {
1430
- width: 400,
1431
- key: 'sscTableDescription',
1432
- label: this.locale.sscTableDescription,
1433
- },
1434
- {
1435
- width: 200,
1436
- key: 'sscTableRepairStatus',
1437
- label: this.locale.sscTableRepairStatus,
1438
- },
1439
- {
1440
- width: 200,
1441
- key: 'sscTableOPCode',
1442
- label: this.locale.sscTableOPCode,
1443
- },
1444
- {
1445
- width: 200,
1446
- key: 'sscTablePartNumber',
1447
- label: this.locale.sscTablePartNumber,
1448
- },
1449
- ];
1450
- const rows = !((_a = this.vehicleInformation) === null || _a === void 0 ? void 0 : _a.ssc)
1451
- ? []
1452
- : (_b = this.vehicleInformation) === null || _b === void 0 ? void 0 : _b.ssc.map(sscItem => ({
1453
- sscTableCode: sscItem === null || sscItem === void 0 ? void 0 : sscItem.sscCode,
1454
- sscTableDescription: sscItem === null || sscItem === void 0 ? void 0 : sscItem.description,
1455
- sscTableRepairStatus: () => (h("div", { class: "table-cell-container" }, h("img", { class: "table-status-icon", src: (sscItem === null || sscItem === void 0 ? void 0 : sscItem.repaired) ? checkSvg : xMarkSvg }), " ", sscItem === null || sscItem === void 0 ? void 0 :
1456
- sscItem.repairDate)),
1457
- sscTableOPCode: () => (h("div", { class: "table-cell-container table-cell-labors-container" }, !!(sscItem === null || sscItem === void 0 ? void 0 : sscItem.labors.length)
1458
- ? sscItem === null || sscItem === void 0 ? void 0 : sscItem.labors.map(labor => (h("div", { key: labor === null || labor === void 0 ? void 0 : labor.laborCode, class: "success" }, labor === null || labor === void 0 ? void 0 : labor.laborCode)))
1459
- : '...')),
1460
- sscTablePartNumber: () => (h("div", { class: "table-cell-container table-cell-parts-container" }, !!(sscItem === null || sscItem === void 0 ? void 0 : sscItem.parts.length)
1461
- ? sscItem === null || sscItem === void 0 ? void 0 : sscItem.parts.map(part => (h("div", { key: part === null || part === void 0 ? void 0 : part.partNumber, class: (part === null || part === void 0 ? void 0 : part.isAvailable) ? 'success' : 'reject' }, part === null || part === void 0 ? void 0 : part.partNumber)))
1462
- : '...')),
1463
- }));
1464
- const templateRow = {
1465
- sscTableOPCode: () => h("div", { key: '16198c767d3f0ed5d1edf988caf6556e9642c49e', class: "h-[25px]" }),
1466
- sscTablePartNumber: () => h("div", { key: '6b3b6c9f8bb3409c52dd1fa2718674c6e85f7872', class: "h-[25px]" }),
1467
- sscTableRepairStatus: () => h("div", { key: '511c6432752f98c94429df5f3e32d7ad4f3c9589', class: "h-[25px]" }),
1468
- };
1469
- return (h(Host, { key: 'df06780738710b1e3ce92e1a7753dd33519e98b1' }, h(VehicleInfoLayout, { key: '4a0ee65e2a6b8b1f91667f80be78a6572f837887', isError: isError, isLoading: isLoading, coreOnly: this.coreOnly, vin: (_c = this.vehicleInformation) === null || _c === void 0 ? void 0 : _c.vin, direction: this.sharedLocales.direction, errorMessage: this.sharedLocales.errors[this.errorMessage] || this.sharedLocales.errors.wildCard }, h("div", { key: 'f8ad0272056c8e2bbaeaad56d10d77923dcb3ab2', class: "p-[16px]" }, this.showWarranty && (h(CardsContainer, { key: 'c299e6d368082d8bcecfeeb1f5a3280573ee31ef', isLoading: isLoading, warrantyLocale: this.locale, vehicleInformation: this.vehicleInformation, isAuthorized: (_d = this.vehicleInformation) === null || _d === void 0 ? void 0 : _d.isAuthorized, unInvoicedByBrokerName: this.unInvoicedByBrokerName })), h("div", { key: '0119294c0732e325ab00062a0d5c73ec001cca16', class: "h-[8px]" }), h("flexible-container", { key: 'f2d87d776bd901cdfe9190a73ff9fd3d3cf22ae3', isOpened: this.showRecaptcha, classes: cn('w-fit mx-auto shift-skeleton', { loading: !this.showRecaptcha }) }, h("div", { key: '2fc85cf5e3ec48e2bb9932de16d41d90eed568e9', style: { height: 'auto' }, class: "recaptcha-container" }, h("slot", { key: '0edf5fd9b523445cba73005e954170ae5785fd5f' })), ['data', 'data-loading'].includes(this.state) && this.recaptchaRes && (h("div", { key: '2d5588e675f7a2cafc75eff5ccd33c87756d9d74', class: cn('recaptcha-response', !((_e = this.recaptchaRes) === null || _e === void 0 ? void 0 : _e.hasSSC) ? 'success-card' : 'reject-card ') }, this.locale[(_f = this.recaptchaRes) === null || _f === void 0 ? void 0 : _f.message])))), h("flexible-container", { key: '8500078c0e6bf95361469493290cf9f496b69cb5', isOpened: this.checkingUnauthorizedSSC, classes: "w-fit mx-auto" }, h("div", { key: '86a2427ab5319c1e9bfe09dbfbe2cb6c7120cd18', class: "pt-[16px]" }, h("div", { key: '823fb3a2ae96ea134ca8e161d410bbf066587c95', class: "flex shift-skeleton flex-col gap-[8px]" }, h("strong", { key: 'b3501544652c97c706285abbbc12463f276e486a' }, this.locale.checkingTMC), h("div", { key: 'c0a2e7c221d91fc12d3969838f45963c987362b0', class: "relative pt-[40px]" }, h("loading-spinner", { key: '8dffece3bbe135ccb29569d9c6c685acaf9551b3', isLoading: this.checkingUnauthorizedSSC }))))), h("div", { key: '461491269795bf7e537e177dadbc4cc3344ed3d1', class: "mt-[32px] mx-auto w-fit max-w-full" }, h("div", { key: '0d5f8ff8ba8531447e286a0ecd146c839a118384', class: "bg-[#f6f6f6] h-[50px] flex items-center justify-center px-[16px] font-bold text-[18px]" }, this.locale.sscCampings), h("div", { key: 'd492ac78fa97c7fdce9d8aa12913077d02a0536c', class: "overflow-x-auto" }, h("information-table", { key: 'b64cc1d884c6e2a1920e6f1b1de849f1b520e641', isLoading: isLoading, templateRow: templateRow, rows: rows, headers: tableHeaders }))))));
1470
- }
1471
- get el() { return getElement(this); }
1472
- static get watchers() { return {
1473
- "language": ["changeLanguage"],
1474
- "state": ["loadingListener"]
1475
- }; }
1476
- };
1477
- VehicleWarrantyDetails.style = vehicleWarrantyDetailsCss;
1478
-
1479
- export { ShiftTabContent as shift_tab_content, VehicleAccessories as vehicle_accessories, VehicleClaimableItems as vehicle_claimable_items, VehiclePaintThickness as vehicle_paint_thickness, VehicleServiceHistory as vehicle_service_history, VehicleSpecification as vehicle_specification, VehicleWarrantyDetails as vehicle_warranty_details };