adp-web-components 0.0.90 → 0.0.91

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