{"version":3,"file":"DV6UwIwf.js","sources":["../../../../components/molecules/VVehicleCard/VVehicleCard.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Agency, Price, VehicleCategory } from '~/types/api'\n\nexport interface VehicleCardProps {\n    vehicle?: VehicleCategory\n    // Supports overriding agency code for reservation link\n    id?: string\n    agency?: Agency\n    pricing?: Price\n    duration?: number\n    loading?: boolean\n    minify?: boolean\n    includedKilometers?: number\n    enableLink?: boolean\n    availabilityStatus?: number\n}\n\nconst props = defineProps<VehicleCardProps>()\n\nconst { equivalent, tags, pricingLabel, durationLabel, categoryName, media, title, includedKmLabel }\n    = useVehicleCard({ props })\n\nconst mrcAgencyCode = computed(() => props.vehicle?.mrcCategoryCode?.toLocaleLowerCase())\n\nconst { optionsRoute, requestRoute } = useReservationLink({\n    vehicle: mrcAgencyCode.value,\n    // Supports overriding agency code for reservation link\n    depAgency: props.agency?.mrcAgencyCode?.toLocaleLowerCase(),\n})\n\n// BUTTONS AND ACTION CONTROLS\nconst { t } = useI18n()\n\nconst availability = computed(() => {\n    if (props.availabilityStatus === 10) return 'available'\n    if (props.availabilityStatus === 20) return 'peripheral_agency'\n    if (props.availabilityStatus === 30) return 'unavailable'\n    else return 'unknown'\n})\n\nconst availabilityTitle = computed(() => {\n    if (availability.value === 'available') return t('available')\n    else if (availability.value === 'unavailable' || availability.value === 'peripheral_agency') return t('unavailable')\n\n    return undefined\n})\n\nconst availabilityMessage = computed(() => {\n    const content = availabilityTitle.value ? `**${t(availabilityTitle.value)}**` : ''\n\n    if (availability.value === 'available' || availability.value === 'peripheral_agency') {\n        return `${content}\\n ${t('in_this_agency')}`\n    }\n\n    return content\n})\n\nconst emits = defineEmits<{\n    showAvailableAgencies: [id: string | undefined]\n}>()\n\nconst buttonProps = computed(() => {\n    if (!props.enableLink) return\n\n    if (availability.value === 'available') {\n        return {\n            label: t('choose_button.label'),\n            to: optionsRoute.value,\n            iconName: 'chevron-right',\n            theme: 'yellow',\n            filled: true,\n            loading: props.loading,\n        }\n    }\n    else if (availability.value === 'peripheral_agency') {\n        return {\n            label: t('other_agencies'),\n            iconName: 'chevron-right',\n            loading: props.loading,\n            outlined: true,\n            onClick: () => emits('showAvailableAgencies', props.id),\n        }\n    }\n    else if (availability.value === 'unavailable') {\n        return {\n            label: t('request_a_rental'),\n            to: requestRoute.value,\n            iconName: 'chevron-right',\n            loading: props.loading,\n        }\n    }\n    return undefined\n})\n</script>\n\n<template>\n    <div\n        v-if=\"minify\"\n        :class=\"$style['root-minify']\"\n    >\n        <VVehicleVisual\n            minify\n            :media=\"media\"\n            sizes=\"180px lg:360px\"\n            :alt=\"media?.title || title\"\n        />\n\n        <div>\n            <div class=\"text-body-m medium\">\n                {{ title }}\n            </div>\n            <div\n                v-if=\"pricingLabel\"\n                class=\"text-body-m medium\"\n            >\n                {{ pricingLabel }}\n            </div>\n            <div\n                v-if=\"includedKmLabel\"\n                class=\"text-body-s color-secondary\"\n            >\n                {{ includedKmLabel }}\n            </div>\n            <div\n                v-if=\"durationLabel\"\n                class=\"text-body-s color-secondary\"\n            >\n                {{ durationLabel }}\n            </div>\n        </div>\n    </div>\n    <section\n        v-else\n        :class=\"[$style.root, enableLink && $style['root--with-link']]\"\n    >\n        <VTag\n            v-if=\"categoryName\"\n            :class=\"$style.category\"\n            :label=\"categoryName\"\n        />\n\n        <VLinkWrapper :to=\"buttonProps?.to\">\n            <VVehicleVisual\n                :media=\"media\"\n                sizes=\"620px md:40vw lg:40vw hd:30vw\"\n                :alt=\"media?.title || title\"\n            />\n        </VLinkWrapper>\n\n        <VVehicleCardContent\n            :title=\"title\"\n            title-class=\"text-h3\"\n            :tags=\"tags\"\n            :loading=\"loading\"\n            :equivalent=\"equivalent\"\n            :pricing-label=\"pricingLabel\"\n            :duration-label=\"durationLabel\"\n            :price-detail=\"includedKmLabel\"\n        >\n            <slot>\n                <VMarkdown\n                    :content=\"availabilityMessage\"\n                    inline\n                    :class=\"$style['book-availability']\"\n                />\n                <VButton\n                    v-if=\"buttonProps\"\n                    v-bind=\"buttonProps\"\n                    :class=\"$style['book-button']\"\n                />\n            </slot>\n        </VVehicleCardContent>\n    </section>\n</template>\n\n<style lang=\"scss\" module>\n.root {\n    padding: var(--v-vehicle-card-padding, #{rem(20) rem(16) rem(24) rem(16)});\n    border-width: var(--v-vehicle-card-border-width, 1px);\n    border-style: solid;\n    border-color: var(--v-vehicle-card-border-color, transparent);\n    border-radius: var(--radius-md);\n    background-color: var(--v-vehicle-card-background, color(white));\n    transition: border-color 0.3s;\n\n    @media (hover: hover) {\n        &--with-link:hover {\n            --v-vehicle-card-border-color: #{color(black)};\n        }\n    }\n\n    @include media('>=md') {\n        padding: var(--v-vehicle-card-padding, #{rem(24) rem(32) rem(32) rem(32)});\n    }\n}\n\n.root-minify {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    text-align: right;\n}\n\n.category {\n    margin-bottom: rem(12);\n}\n\n.tooltip__title {\n    margin-right: rem(4 + 3);\n    color: color(content-secondary);\n}\n\n.tags {\n    display: flex;\n    flex-wrap: wrap;\n    padding: rem(12) 0;\n    border-top: 1px solid color(black-10);\n    gap: rem(8);\n    margin-block: rem(12) 0;\n\n    &:last-child {\n        padding-bottom: unset;\n    }\n}\n\n.tag {\n    @include tag-filled-md;\n\n    font-weight: 500;\n}\n\n.pricing {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: flex-end;\n    justify-content: space-between;\n    padding-top: rem(12);\n    border-top: 1px solid color(black-10);\n    gap: rem(12);\n}\n\n.price-loading {\n    color: color(grey-400);\n}\n\n.pricing__title {\n    @include text-pricing;\n\n    min-height: rem(33);\n}\n\n.duration {\n    color: color(content-secondary);\n\n    .root--layout-minify & {\n        text-align: right;\n    }\n}\n\n.book-availability {\n    @include text-body-m;\n\n    strong {\n        display: block;\n    }\n}\n\n.book-button {\n    flex-shrink: 0;\n    align-self: flex-end;\n    margin-left: auto;\n\n    @include media('<sm') {\n        @include v-button-size('s');\n    }\n}\n</style>\n"],"names":["props","__props","equivalent","tags","pricingLabel","durationLabel","categoryName","media","title","includedKmLabel","useVehicleCard","mrcAgencyCode","computed","_b","_a","optionsRoute","requestRoute","useReservationLink","t","useI18n","availability","availabilityTitle","availabilityMessage","content","emits","__emit","buttonProps"],"mappings":"4qBAiBA,MAAMA,EAAQC,EAER,CAAE,WAAAC,EAAY,KAAAC,EAAM,aAAAC,EAAc,cAAAC,EAAe,aAAAC,EAAc,MAAAC,EAAO,MAAAC,EAAO,gBAAAC,CAAgB,EAC7FC,EAAe,CAAE,MAAAV,CAAO,CAAA,EAExBW,EAAgBC,EAAS,IAAM,SAAA,OAAAC,GAAAC,EAAAd,EAAM,UAAN,YAAAc,EAAe,kBAAf,YAAAD,EAAgC,oBAAmB,EAElF,CAAE,aAAAE,EAAc,aAAAC,CAAa,EAAIC,GAAmB,CACtD,QAASN,EAAc,MAEvB,WAAWE,GAAAC,EAAAd,EAAM,SAAN,YAAAc,EAAc,gBAAd,YAAAD,EAA6B,mBAAkB,CAC7D,EAGK,CAAE,EAAAK,GAAMC,IAERC,EAAeR,EAAS,IACtBZ,EAAM,qBAAuB,GAAW,YACxCA,EAAM,qBAAuB,GAAW,oBACxCA,EAAM,qBAAuB,GAAW,cAChC,SACf,EAEKqB,EAAoBT,EAAS,IAAM,CACrC,GAAIQ,EAAa,QAAU,YAAa,OAAOF,EAAE,WAAW,EACnD,GAAAE,EAAa,QAAU,eAAiBA,EAAa,QAAU,oBAAqB,OAAOF,EAAE,aAAa,CAE5G,CACV,EAEKI,EAAsBV,EAAS,IAAM,CACjC,MAAAW,EAAUF,EAAkB,MAAQ,KAAKH,EAAEG,EAAkB,KAAK,CAAC,KAAO,GAEhF,OAAID,EAAa,QAAU,aAAeA,EAAa,QAAU,oBACtD,GAAGG,CAAO;AAAA,GAAML,EAAE,gBAAgB,CAAC,GAGvCK,CAAA,CACV,EAEKC,EAAQC,EAIRC,EAAcd,EAAS,IAAM,CAC3B,GAACZ,EAAM,WAEP,IAAAoB,EAAa,QAAU,YAChB,MAAA,CACH,MAAOF,EAAE,qBAAqB,EAC9B,GAAIH,EAAa,MACjB,SAAU,gBACV,MAAO,SACP,OAAQ,GACR,QAASf,EAAM,OAAA,EAEvB,GACSoB,EAAa,QAAU,oBACrB,MAAA,CACH,MAAOF,EAAE,gBAAgB,EACzB,SAAU,gBACV,QAASlB,EAAM,QACf,SAAU,GACV,QAAS,IAAMwB,EAAM,wBAAyBxB,EAAM,EAAE,CAAA,EAE9D,GACSoB,EAAa,QAAU,cACrB,MAAA,CACH,MAAOF,EAAE,kBAAkB,EAC3B,GAAIF,EAAa,MACjB,SAAU,gBACV,QAAShB,EAAM,OAAA,EAGhB,CACV"}