{"version":3,"file":"NotificationElement-ef4bc61e.js","sources":["../../src/components/ui/Files/Templates/Designs/Mobler/src/components/ui/NotificationElement.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { ref } from 'vue'\r\n\r\nconst props = defineProps({\r\n\ttheme: {\r\n\t\ttype: String,\r\n\t\tvalidator(value, props) {\r\n\t\t\treturn ['success', 'warning', 'info', 'danger'].includes(<string>value)\r\n\t\t}\r\n\t},\r\n\tcontent: {\r\n\t\ttype: Object,\r\n\t}\r\n})\r\n\r\nconst notificationData = {\r\n\tbannerStyle: {\r\n\t\tbackgroundColor: props.content?.bannerStyle.backgroundColor,\r\n\t\ttextColor: props.content?.bannerStyle.textColor\r\n\t},\r\n\tbannerContent: {\r\n\t\tlink: props.content?.bannerContent[0].link,\r\n\t\ttext: props.content?.bannerContent[0].text\r\n\t}\r\n}\r\n\r\nconst setBackgroundColor = () => {\r\n\tif (props.theme == 'success') return 'bg-success'\r\n\tif (props.theme == 'warning') return 'bg-warning'\r\n\tif (props.theme == 'info') return 'bg-info'\r\n\tif (props.theme == 'danger') return 'bg-danger'\r\n\treturn 'bg-white'\r\n}\r\n\r\nconst textColor = ref('')\r\ntextColor.value = notificationData?.bannerStyle.textColor\r\n</script>\r\n\r\n<template>\r\n\t<div class=\"p-4 w-full\"\r\n\t\t:class=\"setBackgroundColor()\"\r\n\t\t:style=\"{ backgroundColor: notificationData.bannerStyle.backgroundColor }\">\r\n\t\t<div v-if=\"$slots.content\"\r\n\t\t\t class=\"flex flex-col md:flex-row items-center justify-center text-center md:text-left text-balance gap-2 w-full\"\r\n\t\t\t :style=\"{ color: textColor }\">\r\n\t\t\t<slot name=\"content\"></slot>\r\n\t\t</div>\r\n\t\t<div v-else>\r\n\t\t\t<div v-if=\"notificationData.bannerContent.link\">\r\n\t\t\t\t<a :href=\"notificationData.bannerContent.link\"\r\n\t\t\t\t   :style=\"{ color: textColor }\"\r\n\t\t\t\t   v-html=\"notificationData.bannerContent.text\"></a>\r\n\t\t\t</div>\r\n\t\t\t<div v-else\r\n\t\t\t\t :style=\"{ color: textColor }\">\r\n\t\t\t\t{{ notificationData.bannerContent.text }}\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n</template>\r\n\r\n<style scoped>\r\n\r\n</style>\r\n"],"names":["props","__props","notificationData","_a","_b","_c","_d","setBackgroundColor","textColor","ref"],"mappings":"4TAGA,MAAMA,EAAQC,EAYRC,EAAmB,CACxB,YAAa,CACZ,iBAAiBC,EAAAH,EAAM,UAAN,YAAAG,EAAe,YAAY,gBAC5C,WAAWC,EAAAJ,EAAM,UAAN,YAAAI,EAAe,YAAY,SACvC,EACA,cAAe,CACd,MAAMC,EAAAL,EAAM,UAAN,YAAAK,EAAe,cAAc,GAAG,KACtC,MAAMC,EAAAN,EAAM,UAAN,YAAAM,EAAe,cAAc,GAAG,IACvC,CAAA,EAGKC,EAAqB,IACtBP,EAAM,OAAS,UAAkB,aACjCA,EAAM,OAAS,UAAkB,aACjCA,EAAM,OAAS,OAAe,UAC9BA,EAAM,OAAS,SAAiB,YAC7B,WAGFQ,EAAYC,EAAI,EAAE,EACd,OAAAD,EAAA,MAAQN,GAAA,YAAAA,EAAkB,YAAY"}