{"version":3,"file":"HeaderOffer.5029c1f1.js","sources":["../../src/components/HeaderOffer.vue","../../src/components/HeaderOffer.vue?vue&type=template&id=c1916e10&lang.js"],"sourcesContent":["<template>\n  <div :class=\"[classes.headerOffer, layoutClass]\" v-if=\"headerBranding\">\n    <BrandText\n      :class=\"[\n        classes.headerTitle,\n        layoutClass,\n        { [classes.emptyText]: lineOneEmpty }\n      ]\"\n      styleGroup=\"Header Line One\"\n      :get=\"brand => brand.adTemplate.header.lineOne\"\n    />\n    <BrandText\n      :class=\"[\n        classes.headerSubTitle,\n        layoutClass,\n        { [classes.emptyText]: lineTwoEmpty }\n      ]\"\n      styleGroup=\"Header Line Two\"\n      :get=\"brand => brand.adTemplate.header.lineTwo\"\n    />\n  </div>\n</template>\n\n<script>\nimport { injectBrand } from \"@fresh8/ad-data-composition/src/brand\";\nimport { createUseStyles } from \"@fresh8/vue-jss/src\";\nimport { computed, defineComponent } from \"vue\";\nimport { camelize } from \"@fresh8/ad-data-composition/src/lib/formatText\";\nimport BrandText from \"./BrandText.vue\";\nimport {\n  injectTemplateSize,\n  LEADERBOARD,\n  LARGE_LEADERBOARD,\n  SMALL_RESPONSIVE,\n  LMLB,\n  LARGE_MPU,\n  SKYSCRAPER\n} from \"@fresh8/ad-data-composition/src/useTemplateSize\";\n\nconst useStyles = createUseStyles({\n  headerTitle: {\n    flex: 1,\n    fontSize: \"12px\",\n    wordBreak: \"break-all\",\n\n    [`&.${camelize(SMALL_RESPONSIVE.name)}`]: {\n      fontSize: \"10px\",\n      paddingBottom: \"1px\",\n      lineHeight: 1\n    },\n    [`&.${camelize(LMLB.name)}`]: {\n      fontSize: \"10px\",\n      paddingBottom: \"1px\",\n      lineHeight: 1\n    },\n    [`&.${camelize(LARGE_MPU.name)}`]: {\n      fontSize: \"16px\",\n      paddingBottom: \"6px\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    },\n    [`&.${camelize(SKYSCRAPER.name)}`]: {\n      fontSize: \"14px\",\n      paddingBottom: \"2px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    },\n    [`&.${camelize(LEADERBOARD.name)}`]: {\n      fontSize: \"11px\",\n      paddingBottom: \"2px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    },\n    [`&.${camelize(LARGE_LEADERBOARD.name)}`]: {\n      fontSize: \"11px\",\n      paddingBottom: \"2px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    }\n  },\n  headerSubTitle: {\n    flex: 1,\n    lineHeight: 1,\n    fontSize: \"10px\",\n    fontWeight: \"normal\",\n    wordBreak: \"break-all\",\n\n    [`&.${camelize(LARGE_MPU.name)}`]: {\n      fontSize: \"14px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-start\",\n      alignContent: \"center\"\n    },\n\n    [`&.${camelize(SKYSCRAPER.name)}`]: {\n      fontSize: \"12px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-start\",\n      alignContent: \"center\"\n    }\n  },\n  headerOffer: {\n    textAlign: \"right\",\n\n    [`&.${LEADERBOARD.name}`]: {\n      textAlign: \"center\",\n      padding: \"4px\"\n    },\n\n    [`&.${camelize(LARGE_LEADERBOARD.name)}`]: {\n      textAlign: \"center\",\n      padding: \"4px\"\n    },\n\n    [`&.${camelize(LARGE_MPU.name)}`]: {\n      textAlign: \"center\",\n      minHeight: \"84px\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"center\",\n      alignContent: \"center\"\n    },\n\n    [`&.${camelize(SKYSCRAPER.name)}`]: {\n      textAlign: \"center\",\n      minHeight: \"76px\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"center\",\n      alignContent: \"center\"\n    }\n  },\n\n  emptyText: {\n    display: \"flex\",\n    width: \"100%\",\n    minHeight: \"16px\"\n  }\n});\n\nexport default defineComponent({\n  name: \"HeaderOffer\",\n  components: {\n    BrandText\n  },\n  setup() {\n    const { headerBranding } = injectBrand();\n    const classes = useStyles();\n    const templateContext = injectTemplateSize();\n\n    const lineOneEmpty = computed(\n      () => !headerBranding.value.lineOne.value.length\n    );\n    const lineTwoEmpty = computed(\n      () => !headerBranding.value.lineTwo.value.length\n    );\n\n    return {\n      lineOneEmpty,\n      lineTwoEmpty,\n      headerBranding,\n      classes,\n      layoutClass: computed(() => camelize(templateContext.size.value.name))\n    };\n  }\n});\n</script>\n\n<style></style>\n","<template>\n  <div :class=\"[classes.headerOffer, layoutClass]\" v-if=\"headerBranding\">\n    <BrandText\n      :class=\"[\n        classes.headerTitle,\n        layoutClass,\n        { [classes.emptyText]: lineOneEmpty }\n      ]\"\n      styleGroup=\"Header Line One\"\n      :get=\"brand => brand.adTemplate.header.lineOne\"\n    />\n    <BrandText\n      :class=\"[\n        classes.headerSubTitle,\n        layoutClass,\n        { [classes.emptyText]: lineTwoEmpty }\n      ]\"\n      styleGroup=\"Header Line Two\"\n      :get=\"brand => brand.adTemplate.header.lineTwo\"\n    />\n  </div>\n</template>\n\n<script>\nimport { injectBrand } from \"@fresh8/ad-data-composition/src/brand\";\nimport { createUseStyles } from \"@fresh8/vue-jss/src\";\nimport { computed, defineComponent } from \"vue\";\nimport { camelize } from \"@fresh8/ad-data-composition/src/lib/formatText\";\nimport BrandText from \"./BrandText.vue\";\nimport {\n  injectTemplateSize,\n  LEADERBOARD,\n  LARGE_LEADERBOARD,\n  SMALL_RESPONSIVE,\n  LMLB,\n  LARGE_MPU,\n  SKYSCRAPER\n} from \"@fresh8/ad-data-composition/src/useTemplateSize\";\n\nconst useStyles = createUseStyles({\n  headerTitle: {\n    flex: 1,\n    fontSize: \"12px\",\n    wordBreak: \"break-all\",\n\n    [`&.${camelize(SMALL_RESPONSIVE.name)}`]: {\n      fontSize: \"10px\",\n      paddingBottom: \"1px\",\n      lineHeight: 1\n    },\n    [`&.${camelize(LMLB.name)}`]: {\n      fontSize: \"10px\",\n      paddingBottom: \"1px\",\n      lineHeight: 1\n    },\n    [`&.${camelize(LARGE_MPU.name)}`]: {\n      fontSize: \"16px\",\n      paddingBottom: \"6px\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    },\n    [`&.${camelize(SKYSCRAPER.name)}`]: {\n      fontSize: \"14px\",\n      paddingBottom: \"2px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    },\n    [`&.${camelize(LEADERBOARD.name)}`]: {\n      fontSize: \"11px\",\n      paddingBottom: \"2px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    },\n    [`&.${camelize(LARGE_LEADERBOARD.name)}`]: {\n      fontSize: \"11px\",\n      paddingBottom: \"2px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-end\",\n      alignContent: \"center\"\n    }\n  },\n  headerSubTitle: {\n    flex: 1,\n    lineHeight: 1,\n    fontSize: \"10px\",\n    fontWeight: \"normal\",\n    wordBreak: \"break-all\",\n\n    [`&.${camelize(LARGE_MPU.name)}`]: {\n      fontSize: \"14px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-start\",\n      alignContent: \"center\"\n    },\n\n    [`&.${camelize(SKYSCRAPER.name)}`]: {\n      fontSize: \"12px\",\n      wordBreak: \"normal\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"flex-start\",\n      alignContent: \"center\"\n    }\n  },\n  headerOffer: {\n    textAlign: \"right\",\n\n    [`&.${LEADERBOARD.name}`]: {\n      textAlign: \"center\",\n      padding: \"4px\"\n    },\n\n    [`&.${camelize(LARGE_LEADERBOARD.name)}`]: {\n      textAlign: \"center\",\n      padding: \"4px\"\n    },\n\n    [`&.${camelize(LARGE_MPU.name)}`]: {\n      textAlign: \"center\",\n      minHeight: \"84px\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"center\",\n      alignContent: \"center\"\n    },\n\n    [`&.${camelize(SKYSCRAPER.name)}`]: {\n      textAlign: \"center\",\n      minHeight: \"76px\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      justifyContent: \"center\",\n      alignContent: \"center\"\n    }\n  },\n\n  emptyText: {\n    display: \"flex\",\n    width: \"100%\",\n    minHeight: \"16px\"\n  }\n});\n\nexport default defineComponent({\n  name: \"HeaderOffer\",\n  components: {\n    BrandText\n  },\n  setup() {\n    const { headerBranding } = injectBrand();\n    const classes = useStyles();\n    const templateContext = injectTemplateSize();\n\n    const lineOneEmpty = computed(\n      () => !headerBranding.value.lineOne.value.length\n    );\n    const lineTwoEmpty = computed(\n      () => !headerBranding.value.lineTwo.value.length\n    );\n\n    return {\n      lineOneEmpty,\n      lineTwoEmpty,\n      headerBranding,\n      classes,\n      layoutClass: computed(() => camelize(templateContext.size.value.name))\n    };\n  }\n});\n</script>\n\n<style></style>\n"],"names":["useStyles","createUseStyles","headerTitle","flex","fontSize","wordBreak","camelize","SMALL_RESPONSIVE","name","paddingBottom","lineHeight","LMLB","LARGE_MPU","display","flexDirection","justifyContent","alignContent","SKYSCRAPER","LEADERBOARD","LARGE_LEADERBOARD","headerSubTitle","fontWeight","headerOffer","textAlign","padding","minHeight","emptyText","width","defineComponent","components","BrandText","[object Object]","headerBranding","injectBrand","injectTemplateSize","lineOneEmpty","computed","value","lineOne","length","lineTwoEmpty","lineTwo","classes","layoutClass","templateContext","size","_ctx","_createBlock","class","_createVNode","styleGroup","get","brand","adTemplate","header"],"mappings":"oMAuCA,MAAMA,EAAYC,EAAgB,CAChCC,YAAa,CACXC,KAAM,EACNC,SAAU,OACVC,UAAW,aAEV,KAAKC,EAASC,EAAiBC,OAAU,CACxCJ,SAAU,OACVK,cAAe,MACfC,WAAY,IAEb,KAAKJ,EAASK,EAAKH,OAAU,CAC5BJ,SAAU,OACVK,cAAe,MACfC,WAAY,IAEb,KAAKJ,EAASM,EAAUJ,OAAU,CACjCJ,SAAU,OACVK,cAAe,MACfI,QAAS,OACTC,cAAe,SACfC,eAAgB,WAChBC,aAAc,WAEf,KAAKV,EAASW,EAAWT,OAAU,CAClCJ,SAAU,OACVK,cAAe,MACfJ,UAAW,SACXQ,QAAS,OACTC,cAAe,SACfC,eAAgB,WAChBC,aAAc,WAEf,KAAKV,EAASY,EAAYV,OAAU,CACnCJ,SAAU,OACVK,cAAe,MACfJ,UAAW,SACXQ,QAAS,OACTC,cAAe,SACfC,eAAgB,WAChBC,aAAc,WAEf,KAAKV,EAASa,EAAkBX,OAAU,CACzCJ,SAAU,OACVK,cAAe,MACfJ,UAAW,SACXQ,QAAS,OACTC,cAAe,SACfC,eAAgB,WAChBC,aAAc,WAGlBI,eAAgB,CACdjB,KAAM,EACNO,WAAY,EACZN,SAAU,OACViB,WAAY,SACZhB,UAAW,aAEV,KAAKC,EAASM,EAAUJ,OAAU,CACjCJ,SAAU,OACVC,UAAW,SACXQ,QAAS,OACTC,cAAe,SACfC,eAAgB,aAChBC,aAAc,WAGf,KAAKV,EAASW,EAAWT,OAAU,CAClCJ,SAAU,OACVC,UAAW,SACXQ,QAAS,OACTC,cAAe,SACfC,eAAgB,aAChBC,aAAc,WAGlBM,YAAa,CACXC,UAAW,SAEV,KAAKL,EAAYV,MAAS,CACzBe,UAAW,SACXC,QAAS,QAGV,KAAKlB,EAASa,EAAkBX,OAAU,CACzCe,UAAW,SACXC,QAAS,QAGV,KAAKlB,EAASM,EAAUJ,OAAU,CACjCe,UAAW,SACXE,UAAW,OACXZ,QAAS,OACTC,cAAe,SACfC,eAAgB,SAChBC,aAAc,WAGf,KAAKV,EAASW,EAAWT,OAAU,CAClCe,UAAW,SACXE,UAAW,OACXZ,QAAS,OACTC,cAAe,SACfC,eAAgB,SAChBC,aAAc,WAIlBU,UAAW,CACTb,QAAS,OACTc,MAAO,OACPF,UAAW,UAIf,MAAeG,EAAgB,CAC7BpB,KAAM,cACNqB,WAAY,WACVC,GAEFC,6BACUC,GAAmBC,MACXjC,MACQkC,UASjB,CACLC,aARmBC,GACnB,KAAOJ,EAAeK,MAAMC,QAAQD,MAAME,SAQ1CC,aANmBJ,GACnB,KAAOJ,EAAeK,MAAMI,QAAQJ,MAAME,SAM1CP,eAAAA,EACAU,QAAAA,EACAC,YAAaP,GAAS,IAAM9B,EAASsC,EAAgBC,KAAKR,MAAM7B,yEChLbsC,sBAAvDC,eAAMC,OAAQF,UAAQxB,YAAawB,iBACjCG,KACGD,mFAKDE,WAAW,kBACVC,OAAcC,EAAMC,WAAWC,OAAOhB,iCAEzCW,KACGD,sFAKDE,WAAW,kBACVC,OAAcC,EAAMC,WAAWC,OAAOb"}