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