{"version":3,"file":"HorizontalBannerFi-CkhWm6pY.js","sources":["../../src/pages/horizontal-banner-fi/HorizontalBannerFi.vue"],"sourcesContent":["<template>\n  <component-wrapper\n    :class=\"{\n      'horizontal-banner-fi': true,\n      'horizontal-banner-fi--exp': isEditMode,\n      'horizontal-banner-fi--exp-has-image':\n        isEditMode && !fields.image?.value?.src.includes('default_image.svg'),\n      'horizontal-banner-fi--exp-dark': isEditMode && isDark && !hasdoNotModifyImage,\n      'horizontal-banner-fi--exp-light': isEditMode && isLight && !hasdoNotModifyImage,\n    }\"\n  >\n    <component\n      :is=\"link ? 'a' : 'div'\"\n      :href=\"link\"\n    >\n      <div class=\"horizontal-banner-fi__text-container\">\n        <grid-container-fi class=\"horizontal-banner-fi__text-container__grid\">\n          <div\n            :class=\"{\n              'horizontal-banner-fi__right-banner-text': Boolean(fields.textRight?.value),\n              'horizontal-banner-fi__banner-text': !Boolean(fields.textRight?.value),\n            }\"\n          >\n            <richtext-fi\n              :is-theme-light=\"Boolean(fields.mode?.value === 'dark')\"\n              :html-content=\"fields.content\"\n            />\n            <span\n              v-if=\"link\"\n              class=\"fi-text-size-df-30\"\n            >\n              <arrow-icon\n                :class=\"{\n                  'horizontal-banner-fi__banner-text__arrow': true,\n                  'horizontal-banner-fi__banner-text__arrow--dark': Boolean(\n                    fields.mode?.value === 'light',\n                  ),\n                }\"\n              />\n            </span>\n          </div>\n        </grid-container-fi>\n      </div>\n\n      <div class=\"horizontal-banner-fi__banner-image\">\n        <picture\n          v-if=\"!isEditMode && fields.image?.value?.src\"\n          :key=\"isMounted ? 'dom' : 'ssr'\"\n        >\n          <source\n            media=\"(max-width: 767px)\"\n            :srcset=\"\n              appendParams(\n                `${getProxySrc(fields.imageMobile?.value?.src || fields.image.value.src)}`,\n                mobileImageParams,\n              )\n            \"\n          />\n          <source\n            media=\"(max-width: 1439px)\"\n            :srcset=\"\n              appendParams(\n                `${getProxySrc(fields.imageTablet?.value?.src || fields.image.value.src)}`,\n                tabletImageParam,\n              )\n            \"\n          />\n          <img\n            :src=\"appendParams(`${getProxySrc(fields.image.value.src)}`, imageParam)\"\n            :alt=\"fields.image.value.alt || null\"\n          />\n        </picture>\n        <!-- eslint-disable vue/no-v-html -->\n        <div\n          v-else-if=\"isEditMode\"\n          v-html=\"fields.image.editable\"\n        />\n        <!-- eslint-enable vue/no-v-html -->\n      </div>\n    </component>\n  </component-wrapper>\n</template>\n\n<script setup lang=\"ts\">\nimport { ArrowIcon, RichtextFi } from 'atoms/index';\nimport ComponentWrapper from 'components/component-wrapper/ComponentWrapper.vue';\nimport GridContainerFi from 'components/grid-fi/GridContainerFi.vue';\nimport { useCloudImage } from 'composables/cloudImage';\nimport { computed, onMounted, ref } from 'vue';\n\nimport type { CheckboxField, DropDown, ImageField, LinkField } from '@/sitecoreFieldTypes';\n\nconst props = withDefaults(\n  defineProps<{\n    fields: {\n      image?: ImageField;\n      link?: LinkField;\n      content?: string;\n      doNotModifyImage?: CheckboxField;\n      mode?: DropDown;\n      textRight?: CheckboxField;\n    };\n  }>(),\n  {\n    fields: () => ({}),\n  },\n);\n\nconst { getProxySrc, appendParams } = useCloudImage();\n\nconst isMounted = ref(false);\n\nonMounted(() => {\n  isMounted.value = true;\n});\n\nconst isDark = computed<boolean>(() => {\n  return props.fields?.mode?.value === 'dark';\n});\n\nconst isLight = computed<boolean>(() => {\n  return props.fields?.mode?.value === 'light';\n});\n\nconst link = computed<string | null>(() => {\n  const url = props.fields?.link?.value?.href || props.fields?.link?.value?.url;\n  if (url && url !== '') {\n    return url;\n  }\n  return null;\n});\n\nconst hasdoNotModifyImage = computed<boolean>(() => {\n  return !!props.fields?.doNotModifyImage?.value;\n});\n\nconst bgColorise = computed<string>(() => {\n  if (props.fields?.doNotModifyImage && props.fields?.doNotModifyImage.value) {\n    return '';\n  } else {\n    if (isDark.value) {\n      return '&colorize=black';\n    } else {\n      return '&colorize=white';\n    }\n  }\n});\nconst imageParam = computed<string>(() => {\n  return `h=480&aspect_ratio=16:4&func=crop&org_if_sml=0${bgColorise.value}`;\n});\nconst tabletImageParam = computed<string>(() => {\n  return `h=720&aspect_ratio=16:6&func=crop&org_if_sml=0${bgColorise.value}`;\n});\nconst mobileImageParams = computed<string>(() => {\n  return `h=767&aspect_ratio=16:14&func=crop&org_if_sml=0&gravity=north${bgColorise.value}`;\n});\n</script>\n\n<style scoped lang=\"scss\">\n@import './horizontal-banner-fi';\n</style>\n\n<style lang=\"scss\">\n@import './horizontal-banner-fi-unscoped';\n</style>\n"],"names":["props","__props","getProxySrc","appendParams","useCloudImage","isMounted","ref","onMounted","isDark","computed","_b","_a","isLight","link","url","_c","_f","_e","_d","hasdoNotModifyImage","bgColorise","imageParam","tabletImageParam","mobileImageParams"],"mappings":"sbA4FA,MAAMA,EAAQC,EAgBR,CAAE,YAAAC,EAAa,aAAAC,CAAa,EAAIC,EAAc,EAE9CC,EAAYC,EAAI,EAAK,EAE3BC,EAAU,IAAM,CACdF,EAAU,MAAQ,EAAA,CACnB,EAEK,MAAAG,EAASC,EAAkB,IAAM,SAC9B,QAAAC,GAAAC,EAAAX,EAAM,SAAN,YAAAW,EAAc,OAAd,YAAAD,EAAoB,SAAU,MAAA,CACtC,EAEKE,EAAUH,EAAkB,IAAM,SAC/B,QAAAC,GAAAC,EAAAX,EAAM,SAAN,YAAAW,EAAc,OAAd,YAAAD,EAAoB,SAAU,OAAA,CACtC,EAEKG,EAAOJ,EAAwB,IAAM,iBACnC,MAAAK,IAAMC,GAAAL,GAAAC,EAAAX,EAAM,SAAN,YAAAW,EAAc,OAAd,YAAAD,EAAoB,QAApB,YAAAK,EAA2B,SAAQC,GAAAC,GAAAC,EAAAlB,EAAM,SAAN,YAAAkB,EAAc,OAAd,YAAAD,EAAoB,QAApB,YAAAD,EAA2B,KACtE,OAAAF,GAAOA,IAAQ,GACVA,EAEF,IAAA,CACR,EAEKK,EAAsBV,EAAkB,IAAM,SAClD,MAAO,CAAC,GAACC,GAAAC,EAAAX,EAAM,SAAN,YAAAW,EAAc,mBAAd,MAAAD,EAAgC,MAAA,CAC1C,EAEKU,EAAaX,EAAiB,IAAM,SACxC,OAAIE,EAAAX,EAAM,SAAN,MAAAW,EAAc,oBAAoBD,EAAAV,EAAM,SAAN,MAAAU,EAAc,iBAAiB,OAC5D,GAEHF,EAAO,MACF,kBAEA,iBAEX,CACD,EACKa,EAAaZ,EAAiB,IAC3B,iDAAiDW,EAAW,KAAK,EACzE,EACKE,EAAmBb,EAAiB,IACjC,iDAAiDW,EAAW,KAAK,EACzE,EACKG,EAAoBd,EAAiB,IAClC,gEAAgEW,EAAW,KAAK,EACxF"}