{"version":3,"file":"BXv-5mR3.js","sources":["../../../../node_modules/@smenaspace/ui-layer/components/badge/Badge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Color, PrimitivesValue } from '../../types/shared'\n\nconst WIDTH = 20\n\ntype Props = {\n  color: Color\n  backgroundColor: Color\n  content?: PrimitivesValue\n  offsetX?: number\n  offsetY?: number\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  content: undefined,\n  offsetX: 0,\n  offsetY: 0,\n})\n\nconst componentStyles = computed(() => {\n  return {\n    color: props.color,\n    backgroundColor: props.backgroundColor,\n    left: `calc(100% - ${WIDTH / 2 + props.offsetX}px)`,\n    bottom: `calc(100% - ${WIDTH / 2 + props.offsetY}px)`,\n  }\n})\n</script>\n\n<template>\n  <div class=\"app-badge\">\n    <slot />\n\n    <span\n      v-if=\"content\"\n      data-test-id=\"badge-content\"\n      class=\"app-badge__content\"\n      :style=\"componentStyles\"\n    >\n      {{ content }}\n    </span>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.app-badge {\n  position: relative;\n  display: flex;\n\n  &__content {\n    position: absolute;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-width: 20px;\n    height: 20px;\n    padding: 4px 6px;\n    font-size: 12px;\n    font-weight: 800;\n    text-align: center;\n    text-indent: 0;\n    white-space: nowrap;\n    pointer-events: none;\n    border-radius: 20px;\n  }\n}\n</style>\n"],"names":["WIDTH","props","__props","componentStyles","computed"],"mappings":";;kbAGMA,EAAQ,kKAUd,MAAMC,EAAQC,EAMRC,EAAkBC,EAAS,KACxB,CACL,MAAOH,EAAM,MACb,gBAAiBA,EAAM,gBACvB,KAAM,eAAeD,EAAQ,EAAIC,EAAM,OAAO,MAC9C,OAAQ,eAAeD,EAAQ,EAAIC,EAAM,OAAO,KAClD,EACD","debug_id":"750901ca-1a1a-5567-a8a6-63d7adc3c1e7"}