{"version":3,"file":"js/9675.674368f1.js","mappings":"+IAIAA,EAAQ,EAAU,CAACC,EAAKC,KACpB,MAAMC,EAASF,EAAIG,WAAaH,EAChC,IAAK,MAAOI,EAAKC,KAAQJ,EACrBC,EAAOE,GAAOC,EAElB,OAAOH,CAAM,C,464MCNjB,MAAMI,GAAc,GAEpB,U,kwBCgCA,MAAML,EAAQ,EAqCRM,GAAe,SAAS,IACH,aAArBN,EAAMO,WAAkC,8BACnB,YAArBP,EAAMO,WAAiC,8BAClB,cAArBP,EAAMO,WAAmC,iCACpB,eAArBP,EAAMO,WAAoC,iCACrB,eAArBP,EAAMO,WAAoC,gCACrB,aAArBP,EAAMO,WAAkC,0BACrC,KAGHC,GAAsB,SAAS,IACV,aAArBR,EAAMO,aAAsD,IAAzBP,EAAMS,eAAgC,UACpD,aAArBT,EAAMO,aAAsD,IAAzBP,EAAMS,eAAiC,UACrD,YAArBT,EAAMO,WAAiC,UAClB,cAArBP,EAAMO,WAAmC,UACpB,eAArBP,EAAMO,WAAoC,UACrB,eAArBP,EAAMO,WAAoC,UACrB,aAArBP,EAAMO,WAAkC,UACrC,KAIHG,GAAU,SAAS,IACnBV,EAAMW,SAAiB,0BAA0BX,EAAMW,iGAC/C,KAIRC,GAAe,SAAS,IACN,YAAlBZ,EAAMa,SAA2C,gCAAlBb,EAAMa,QAAkD,iCAC/E,iC,wrDClGd,MAAM,IAA2B,QAAgB,GAAQ,CAAC,CAAC,YAAY,qBAEvE,S","sources":["webpack://ellevio-styleguide-web/./node_modules/@vue/cli-service/node_modules/vue-loader/dist/exportHelper.js","webpack://ellevio-styleguide-web/./src/stories/web/vue-components/IconPictogram.vue","webpack://ellevio-styleguide-web/./src/stories/web/vue-components/CallToActionBlock.vue","webpack://ellevio-styleguide-web/./src/stories/web/vue-components/CallToActionBlock.vue?5de9"],"sourcesContent":["\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\n// runtime helper for setting properties on components\n// in a tree-shakable way\nexports.default = (sfc, props) => {\n    const target = sfc.__vccOpts || sfc;\n    for (const [key, val] of props) {\n        target[key] = val;\n    }\n    return target;\n};\n","import script from \"./IconPictogram.vue?vue&type=script&setup=true&lang=js\"\nexport * from \"./IconPictogram.vue?vue&type=script&setup=true&lang=js\"\n\nconst __exports__ = script;\n\nexport default __exports__","<template>\r\n  <div>\r\n    <div class=\"relative\" :class=\"imageUrl ? '' : colorThemeBg\" :style=\"imageBg\">\r\n      <div v-if=\"useOverlay && imageUrl\" class=\"absolute w-full h-full bg-overlay-gradient\"></div>\r\n      <div class=\"flex flex-col gap-12 py-16 overflow-hidden md:gap-10 container-small md:relative md:flex-row\" :class=\"alignBoxCenter ? ' items-center justify-center' : 'justify-between'\">\r\n        <!-- Pictorgram mobile -->\r\n        <div v-if=\"!alignBoxCenter && !imageUrl\" class=\"self-center w-[12.5rem] md:hidden\">\r\n          <ellevio-web-icon-pictogram :type-pictogram=\"typePictogram\" :color-pictogram=\"colorThemePictogram\" />\r\n        </div>\r\n\r\n        <!-- Call To Action Box -->\r\n        <div class=\"box-border relative z-30 flex flex-col gap-8 px-6 py-8 bg-white half-area rounded-xl shadow-mp\" :class=\"alignBoxCenter ? 'text-center items-center' : 'items-start'\">\r\n          <!-- Pictogram inside box -->\r\n          <ellevio-web-icon-pictogram v-if=\"alignBoxCenter\" :type-pictogram=\"typePictogram\" :color-pictogram=\"colorThemePictogram\" class=\"w-[7.375rem] mx-auto\" />\r\n\r\n          <div class=\"flex flex-col gap-4\">\r\n            <h2 class=\"text-3xl md:text-5xl font-futuraEfDemiBold text-newColors-gray-content\">{{ ctaBlock.headerText }}</h2>\r\n            <p class=\"text-xl text-newColors-gray-contentA font-futuraEfBook\">{{ ctaBlock.paragraphText }}</p>\r\n          </div>\r\n          <a :href=\"ctaBlock.linkUrl\" class=\"cursor-pointer btn-primary\" data-testid=\"callToActionBlockLink\">{{ ctaBlock.linkText }}</a>\r\n          <!-- Company label -->\r\n          <p v-if=\"company\" class=\"px-3 py-1 text-base rounded-lg font-futuraEfBook text-newColors-gray-contentA\" :class=\"companyStyle\">{{ company }}</p>\r\n        </div>\r\n\r\n        <!-- Pictorgram desktop -->\r\n        <div v-if=\"!alignBoxCenter && !imageUrl\" class=\"relative items-center justify-center flex-1 hidden md:flex\">\r\n          <ellevio-web-icon-pictogram :type-pictogram=\"typePictogram\" :color-pictogram=\"colorThemePictogram\" class=\"absolute w-[33.75rem] z-10\" />\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup>\r\nimport EllevioWebIconPictogram from '@/stories/web/vue-components/IconPictogram.vue'\r\nimport { computed } from 'vue'\r\n\r\nconst props = defineProps({\r\n  ctaBlock: {\r\n    type: Object,\r\n    default: () => ({\r\n      headerText: '',\r\n      paragraphText: '',\r\n      linkUrl: '#',\r\n      linkText: ''\r\n    })\r\n  },\r\n  alignBoxCenter: {\r\n    type: Boolean,\r\n    default: false\r\n  },\r\n  company: {\r\n    type: String,\r\n    default: ''\r\n  },\r\n  typePictogram: {\r\n    type: String,\r\n    default: ''\r\n  },\r\n  colorTheme: {\r\n    type: String,\r\n    default: 'PrimaryA'\r\n  },\r\n  useOverlay: {\r\n    type: Boolean,\r\n    default: false\r\n  },\r\n  imageUrl: {\r\n    type: String,\r\n    default: ''\r\n  }\r\n})\r\n\r\n// Color theme\r\nconst colorThemeBg = computed(() => {\r\n  if (props.colorTheme === 'PrimaryA') return 'bg-newColors-green-primaryA'\r\n  if (props.colorTheme === 'Primary') return 'bg-newColors-green-primaryB'\r\n  if (props.colorTheme === 'Signature') return 'bg-newColors-orange-signatureB'\r\n  if (props.colorTheme === 'SecondaryA') return 'bg-newColors-orange-secondaryB'\r\n  if (props.colorTheme === 'SecondaryC') return 'bg-newColors-green-secondaryC'\r\n  if (props.colorTheme === 'ContentA') return 'bg-newColors-gray-baseB'\r\n  return ''\r\n})\r\n\r\nconst colorThemePictogram = computed(() => {\r\n  if (props.colorTheme === 'PrimaryA' && props.alignBoxCenter === true) return '#0B8454'\r\n  if (props.colorTheme === 'PrimaryA' && props.alignBoxCenter === false) return '#ffffff'\r\n  if (props.colorTheme === 'Primary') return '#0B8454'\r\n  if (props.colorTheme === 'Signature') return '#FF8300'\r\n  if (props.colorTheme === 'SecondaryA') return '#AAA672'\r\n  if (props.colorTheme === 'SecondaryC') return '#87C8B9'\r\n  if (props.colorTheme === 'ContentA') return '#363433'\r\n  return ''\r\n})\r\n\r\n// Image background\r\nconst imageBg = computed(() => {\r\n  if (props.imageUrl) return `background-image: url('${props.imageUrl}'); background-repeat: no-repeat; background-size: cover; background-position: center;`\r\n  else return ''\r\n})\r\n\r\n// Company style\r\nconst companyStyle = computed(() => {\r\n  if (props.company === 'Ellevio' || props.company === 'Ellevio Energy Solutions AB') return 'bg-newColors-orange-secondaryB'\r\n  else return 'bg-newColors-gray-background'\r\n})\r\n</script>\r\n\r\n<style scoped>\r\n.half-area {\r\n  width: 100%;\r\n}\r\n\r\n@media (min-width: 768px) {\r\n  .half-area {\r\n    width: calc(50% - 1.5rem);\r\n  }\r\n}\r\n</style>\r\n","import script from \"./CallToActionBlock.vue?vue&type=script&setup=true&lang=js\"\nexport * from \"./CallToActionBlock.vue?vue&type=script&setup=true&lang=js\"\n\nimport \"./CallToActionBlock.vue?vue&type=style&index=0&id=5f22684d&scoped=true&lang=css\"\n\nimport exportComponent from \"../../../../node_modules/@vue/cli-service/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['__scopeId',\"data-v-5f22684d\"]])\n\nexport default __exports__"],"names":["exports","sfc","props","target","__vccOpts","key","val","__exports__","colorThemeBg","colorTheme","colorThemePictogram","alignBoxCenter","imageBg","imageUrl","companyStyle","company"],"sourceRoot":""}