{"version":3,"sources":["webpack:///./app/javascript/dashboard/components/widgets/Thumbnail.vue?482a","webpack:///./app/javascript/dashboard/components/widgets/Thumbnail.vue?9d10","webpack:///app/javascript/dashboard/components/widgets/Thumbnail.vue","webpack:///./app/javascript/dashboard/components/widgets/Thumbnail.vue","webpack:///./app/javascript/shared/helpers/emoji.js","webpack:///./app/javascript/dashboard/components/widgets/Avatar.vue?17b2","webpack:///./app/javascript/dashboard/components/widgets/Avatar.vue?8081","webpack:///app/javascript/dashboard/components/widgets/Avatar.vue","webpack:///./app/javascript/dashboard/components/widgets/Avatar.vue","webpack:///./app/javascript/dashboard/components/widgets/Avatar.vue?dd5c","webpack:///./app/javascript/dashboard/components/widgets/Thumbnail.vue?06ef"],"names":["component","_vm","this","_c","_self","class","thumbnailBoxClass","style","height","size","width","attrs","title","_t","directives","name","rawName","value","expression","thumbnailClass","src","on","onImgLoad","onImgError","_v","shouldShowImage","userNameWithoutEmoji","avatarSize","staticClass","badgeSrc","_e","status","hasEmojiSupport","offset","window","devicePixelRatio","node","document","createElement","getContext","fillText","ctx","fillStyle","textBaseline","font","getImageData","data","removeEmoji","text","replace","trim","_s","userInitial"],"mappings":"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","file":"js/6-c48750fff73241488fef.chunk.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{class:_vm.thumbnailBoxClass,style:({ height: _vm.size, width: _vm.size }),attrs:{\"title\":_vm.title}},[_vm._t(\"default\",function(){return [_c('img',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.shouldShowImage),expression:\"shouldShowImage\"}],class:_vm.thumbnailClass,attrs:{\"src\":_vm.src,\"draggable\":\"false\"},on:{\"load\":_vm.onImgLoad,\"error\":_vm.onImgError}}),_vm._v(\" \"),_c('Avatar',{directives:[{name:\"show\",rawName:\"v-show\",value:(!_vm.shouldShowImage),expression:\"!shouldShowImage\"}],class:_vm.thumbnailClass,attrs:{\"username\":_vm.userNameWithoutEmoji,\"size\":_vm.avatarSize}})]}),_vm._v(\" \"),(_vm.badgeSrc)?_c('img',{staticClass:\"source-badge\",style:(_vm.badgeStyle),attrs:{\"src\":`/integrations/channels/badges/${_vm.badgeSrc}.png`,\"alt\":\"Badge\"}}):_vm._e(),_vm._v(\" \"),(_vm.showStatusIndicator)?_c('div',{class:`source-badge user-online-status user-online-status--${_vm.status}`,style:(_vm.statusStyle)}):_vm._e()],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import mod from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Thumbnail.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Thumbnail.vue?vue&type=script&lang=js\"","<template>\n  <div\n    :class=\"thumbnailBoxClass\"\n    :style=\"{ height: size, width: size }\"\n    :title=\"title\"\n  >\n    <!-- Using v-show instead of v-if to avoid flickering as v-if removes dom elements.  -->\n    <slot>\n      <img\n        v-show=\"shouldShowImage\"\n        :src=\"src\"\n        draggable=\"false\"\n        :class=\"thumbnailClass\"\n        @load=\"onImgLoad\"\n        @error=\"onImgError\"\n      />\n      <Avatar\n        v-show=\"!shouldShowImage\"\n        :username=\"userNameWithoutEmoji\"\n        :class=\"thumbnailClass\"\n        :size=\"avatarSize\"\n      />\n    </slot>\n    <img\n      v-if=\"badgeSrc\"\n      class=\"source-badge\"\n      :style=\"badgeStyle\"\n      :src=\"`/integrations/channels/badges/${badgeSrc}.png`\"\n      alt=\"Badge\"\n    />\n    <div\n      v-if=\"showStatusIndicator\"\n      :class=\"`source-badge user-online-status user-online-status--${status}`\"\n      :style=\"statusStyle\"\n    />\n  </div>\n</template>\n<script>\n/**\n * Thumbnail Component\n * Src - source for round image\n * Size - Size of the thumbnail\n * Badge - Chat source indication { fb / telegram }\n * Username - Username for avatar\n */\nimport Avatar from './Avatar.vue';\nimport { removeEmoji } from 'shared/helpers/emoji';\n\nexport default {\n  components: {\n    Avatar,\n  },\n  props: {\n    src: {\n      type: String,\n      default: '',\n    },\n    size: {\n      type: String,\n      default: '40px',\n    },\n    badge: {\n      type: String,\n      default: '',\n    },\n    username: {\n      type: String,\n      default: '',\n    },\n    status: {\n      type: String,\n      default: '',\n    },\n    hasBorder: {\n      type: Boolean,\n      default: false,\n    },\n    shouldShowStatusAlways: {\n      type: Boolean,\n      default: false,\n    },\n    title: {\n      type: String,\n      default: '',\n    },\n    variant: {\n      type: String,\n      default: 'circle',\n    },\n  },\n  data() {\n    return {\n      hasImageLoaded: false,\n      imgError: false,\n    };\n  },\n  computed: {\n    userNameWithoutEmoji() {\n      return removeEmoji(this.username);\n    },\n    showStatusIndicator() {\n      if (this.shouldShowStatusAlways) return true;\n      return this.status === 'online' || this.status === 'busy';\n    },\n    avatarSize() {\n      return Number(this.size.replace(/\\D+/g, ''));\n    },\n    badgeSrc() {\n      return {\n        instagram_direct_message: 'instagram-dm',\n        facebook: 'messenger',\n        'twitter-tweet': 'twitter-tweet',\n        'twitter-dm': 'twitter-dm',\n        whatsapp: 'whatsapp',\n        sms: 'sms',\n        'Channel::Line': 'line',\n        'Channel::Telegram': 'telegram',\n        'Channel::WebWidget': '',\n      }[this.badge];\n    },\n    badgeStyle() {\n      const size = Math.floor(this.avatarSize / 3);\n      const badgeSize = `${size + 2}px`;\n      const borderRadius = `${size / 2}px`;\n      return { width: badgeSize, height: badgeSize, borderRadius };\n    },\n    statusStyle() {\n      const statusSize = `${this.avatarSize / 4}px`;\n      return { width: statusSize, height: statusSize };\n    },\n    thumbnailClass() {\n      const className = this.hasBorder\n        ? 'border border-solid border-white dark:border-slate-700/50'\n        : '';\n      const variant =\n        this.variant === 'circle' ? 'thumbnail-rounded' : 'thumbnail-square';\n      return `user-thumbnail ${className} ${variant}`;\n    },\n    thumbnailBoxClass() {\n      const boxClass = this.variant === 'circle' ? 'is-rounded' : '';\n      return `user-thumbnail-box ${boxClass}`;\n    },\n    shouldShowImage() {\n      if (!this.src) {\n        return false;\n      }\n      if (this.hasImageLoaded) {\n        return !this.imgError;\n      }\n      return false;\n    },\n  },\n  watch: {\n    src(value, oldValue) {\n      if (value !== oldValue && this.imgError) {\n        this.imgError = false;\n      }\n    },\n  },\n  methods: {\n    onImgError() {\n      this.imgError = true;\n    },\n    onImgLoad() {\n      this.hasImageLoaded = true;\n    },\n  },\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.user-thumbnail-box {\n  flex: 0 0 auto;\n  max-width: 100%;\n  position: relative;\n\n  &.is-rounded {\n    border-radius: 50%;\n  }\n\n  .user-thumbnail {\n    border-radius: 50%;\n    &.thumbnail-square {\n      border-radius: var(--border-radius-large);\n    }\n    height: 100%;\n    width: 100%;\n    box-sizing: border-box;\n    object-fit: cover;\n    vertical-align: initial;\n  }\n\n  .source-badge {\n    border-radius: var(--border-radius-small);\n    bottom: var(--space-minus-micro);\n    box-shadow: var(--shadow-small);\n    height: var(--space-slab);\n    padding: var(--space-micro);\n    position: absolute;\n    right: 0;\n    width: var(--space-slab);\n    @apply bg-white dark:bg-slate-900;\n  }\n\n  .user-online-status {\n    border-radius: 50%;\n    bottom: var(--space-micro);\n\n    &:after {\n      content: ' ';\n    }\n  }\n\n  .user-online-status--online {\n    @apply bg-green-400 dark:bg-green-400;\n  }\n\n  .user-online-status--busy {\n    @apply bg-yellow-500 dark:bg-yellow-500;\n  }\n\n  .user-online-status--offline {\n    @apply bg-slate-500 dark:bg-slate-500;\n  }\n}\n</style>\n","import { render, staticRenderFns } from \"./Thumbnail.vue?vue&type=template&id=3ea7931e&scoped=true\"\nimport script from \"./Thumbnail.vue?vue&type=script&lang=js\"\nexport * from \"./Thumbnail.vue?vue&type=script&lang=js\"\nimport style0 from \"./Thumbnail.vue?vue&type=style&index=0&id=3ea7931e&prod&lang=scss&scoped=true\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"3ea7931e\",\n  null\n  \n)\n\nexport default component.exports","/**\n * Detects support for emoji character sets.\n *\n * Based on the Modernizr emoji detection.\n * https://github.com/Modernizr/Modernizr/blob/347ddb078116cee91b25b6e897e211b023f9dcb4/feature-detects/emoji.js\n *\n * @return {Boolean} true or false\n * @example\n *\n * hasEmojiSupport()\n * // => true|false\n */\nexport const hasEmojiSupport = () => {\n  const pixelRatio = window.devicePixelRatio || 1;\n  const offset = 12 * pixelRatio;\n  const node = document.createElement('canvas');\n\n  // canvastext support\n  if (\n    !node.getContext ||\n    !node.getContext('2d') ||\n    typeof node.getContext('2d').fillText !== 'function'\n  ) {\n    return false;\n  }\n\n  const ctx = node.getContext('2d');\n\n  ctx.fillStyle = '#f00';\n  ctx.textBaseline = 'top';\n  ctx.font = '32px Arial';\n  ctx.fillText('\\ud83d\\udc28', 0, 0); // U+1F428 KOALA\n  return ctx.getImageData(offset, offset, 1, 1).data[0] !== 0;\n};\n\nexport const removeEmoji = text => {\n  if (text) {\n    return text\n      .replace(\n        /([\\u2700-\\u27BF]|[\\uE000-\\uF8FF]|\\uD83C[\\uDC00-\\uDFFF]|\\uD83D[\\uDC00-\\uDFFF]|[\\u2011-\\u26FF]|\\uD83E[\\uDD10-\\uDDFF])/g,\n        ''\n      )\n      .replace(/\\s+/g, ' ')\n      .trim();\n  }\n  return '';\n};\n","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"avatar-container\",style:(_vm.style),attrs:{\"aria-hidden\":\"true\"}},[_vm._t(\"default\",function(){return [_vm._v(_vm._s(_vm.userInitial))]})],2)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import mod from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Avatar.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../../../node_modules/babel-loader/lib/index.js??ref--7-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Avatar.vue?vue&type=script&lang=js\"","<template>\n  <div class=\"avatar-container\" :style=\"style\" aria-hidden=\"true\">\n    <slot>{{ userInitial }}</slot>\n  </div>\n</template>\n\n<script>\nexport default {\n  name: 'Avatar',\n  props: {\n    username: {\n      type: String,\n      default: '',\n    },\n    size: {\n      type: Number,\n      default: 40,\n    },\n  },\n  computed: {\n    style() {\n      return {\n        fontSize: `${Math.floor(this.size / 2.5)}px`,\n      };\n    },\n    userInitial() {\n      const parts = this.username.split(/[ -]/);\n      let initials = parts.reduce((acc, curr) => acc + curr.charAt(0), '');\n\n      if (initials.length > 2 && initials.search(/[A-Z]/) !== -1) {\n        initials = initials.replace(/[a-z]+/g, '');\n      }\n      initials = initials.substring(0, 2).toUpperCase();\n\n      return initials;\n    },\n  },\n};\n</script>\n\n<style scoped>\n@tailwind components;\n@layer components {\n  .avatar-color {\n    background-image: linear-gradient(to top, #c2e1ff 0%, #d6ebff 100%);\n  }\n\n  .dark-avatar-color {\n    background-image: linear-gradient(to top, #135899 0%, #135899 100%);\n  }\n}\n.avatar-container {\n  @apply flex leading-[100%] font-medium items-center justify-center text-center cursor-default avatar-color dark:dark-avatar-color text-woot-600 dark:text-woot-200;\n}\n</style>\n","import { render, staticRenderFns } from \"./Avatar.vue?vue&type=template&id=139a08b4&scoped=true\"\nimport script from \"./Avatar.vue?vue&type=script&lang=js\"\nexport * from \"./Avatar.vue?vue&type=script&lang=js\"\nimport style0 from \"./Avatar.vue?vue&type=style&index=0&id=139a08b4&prod&scoped=true&lang=css\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"139a08b4\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js!../../../../../node_modules/css-loader/dist/cjs.js??ref--2-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/dist/cjs.js??ref--2-2!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Avatar.vue?vue&type=style&index=0&id=139a08b4&prod&scoped=true&lang=css\"","export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js!../../../../../node_modules/css-loader/dist/cjs.js??ref--3-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/dist/cjs.js??ref--3-2!../../../../../node_modules/sass-loader/dist/cjs.js??ref--3-3!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Thumbnail.vue?vue&type=style&index=0&id=3ea7931e&prod&lang=scss&scoped=true\""],"sourceRoot":""}