{"version":3,"sources":["webpack:///./src/assets/img/levels/tiers sync ^\\.\\/.*\\-large\\.png$","webpack:///./src/modals/account/views/components/AccountLevelsSlider.vue?27fd","webpack:///src/modals/account/views/components/AccountLevelsSlider.vue","webpack:///./src/modals/account/views/components/AccountLevelsSlider.vue?38ee","webpack:///./src/modals/account/views/components/AccountLevelsSlider.vue","webpack:///./src/modals/account/views/components/AccountLevelsSlider.vue?0342","webpack:///./src/modals/account/views/components/AccountLevelsHeader.vue?512f","webpack:///src/modals/account/views/components/AccountLevelsHeader.vue","webpack:///./src/modals/account/views/components/AccountLevelsHeader.vue?2fc0","webpack:///./src/modals/account/views/components/AccountLevelsHeader.vue"],"names":["map","webpackContext","req","id","webpackContextResolve","__webpack_require__","o","e","Error","code","keys","Object","resolve","module","exports","render","_vm","this","_h","$createElement","_c","_self","ref","staticClass","_l","lsLevel","lsXp","key","class","config","tierUpgradeEvery","attrs","toTier","rewards","reward","i","domProps","_s","$t","data","_v","claimedLevels","find","isLevelClaimable","_e","renderedMaxLevel","on","$event","flickity","previous","next","select","renderedLevels","length","renderedLevelIndex","staticRenderFns","MAX_RENDERED_LEVELS","getLevelUserRewards","level","tier","Math","min","floor","maxTier","tierOverrides","levelOverrides","overrides","spins","spinsAmount","extras","push","tierLevel","tierProgress","spinsConfig","factor","max","spinsFactor","round","type","components","props","loading","Boolean","default","xp","Number","required","Array","computed","nextLevel","half","start","end","levels","slice","findIndex","l","maxXp","renderedMaxXp","includes","cellAlign","cellSelector","initialIndex","prevNextButtons","pageDots","wrapAround","destroy","methods","claimable","component","VBtn","iconSize","$tc","_f","VImg"],"mappings":"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","file":"js/account-views-components-AccountLevelsSlider.modal.aee9a614.js","sourcesContent":["var map = {\n\t\"./0-large.png\": \"7017\",\n\t\"./1-large.png\": \"5c0f\",\n\t\"./10-large.png\": \"7f9d\",\n\t\"./11-large.png\": \"a3cb\",\n\t\"./12-large.png\": \"e7c1\",\n\t\"./13-large.png\": \"eaf0\",\n\t\"./14-large.png\": \"7c71\",\n\t\"./15-large.png\": \"db5d\",\n\t\"./16-large.png\": \"081f\",\n\t\"./17-large.png\": \"c260\",\n\t\"./18-large.png\": \"e90d\",\n\t\"./19-large.png\": \"dfac\",\n\t\"./2-large.png\": \"84cd\",\n\t\"./20-large.png\": \"5c84\",\n\t\"./3-large.png\": \"29c5\",\n\t\"./4-large.png\": \"df77\",\n\t\"./5-large.png\": \"450e\",\n\t\"./6-large.png\": \"d3d6\",\n\t\"./7-large.png\": \"c8eb\",\n\t\"./8-large.png\": \"4fa7\",\n\t\"./9-large.png\": \"2299\"\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = \"24d2\";","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{ref:\"levelSlider\",staticClass:\"level-slider pb-8 pt-12\"},[_vm._l((_vm.renderedLevels),function(ref){\nvar lsLevel = ref[0];\nvar lsXp = ref[1];\nreturn _c('div',{key:lsLevel,staticClass:\"level-slide bg-ui-panel d-flex align-center flex-column mx-8 px-4 py-3\",class:{\n      'is-tier-upgrade py-4': lsLevel % _vm.config.tierUpgradeEvery === 0,\n    }},[_c('AccountLevelsHeader',{staticClass:\"mb-2\",attrs:{\"icon-size\":48,\"level\":lsLevel,\"tier\":_vm.toTier(lsLevel),\"xp\":lsXp}}),(_vm.rewards[lsLevel].length)?_c('ul',{staticClass:\"pl-0 flex-grow-1 mb-2 green100--text text-caption\"},_vm._l((_vm.rewards[lsLevel]),function(reward,i){return _c('li',{key:i},[_c('span',{domProps:{\"textContent\":_vm._s(_vm.$t((\"page.account.level_rewards.type.\" + (reward.type)), reward.data))}})])}),0):_c('p',{staticClass:\"text-caption mb-0 text--secondary\"},[_vm._v(\" No rewards \")]),(_vm.rewards[lsLevel].length)?_c('span',{staticClass:\"text-uppercase text-caption\"},[(_vm.claimedLevels.find(function (i) { return i === +lsLevel; }))?_c('span',{staticClass:\"green400--text font-weight-bold\"},[_c('fai',{attrs:{\"icon\":['fas', 'check']}}),_vm._v(\" Claimed \")],1):(_vm.isLevelClaimable(lsLevel))?_c('span',{staticClass:\"blue300--text font-weight-semibold\"},[_vm._v(\" Unclaimed \")]):_vm._e()]):_vm._e()],1)}),(!_vm.renderedMaxLevel)?_c('div',{staticClass:\"level-slide bg-ui-panel d-flex align-center justify-center flex-column mx-8 pa-4 py-6\"},[_c('fai',{staticClass:\"blue200--text mb-4 text-h5\",attrs:{\"fixed-width\":\"\",\"icon\":['fas', 'chevron-double-down'],\"rotation\":\"270\"}}),_c('span',{staticClass:\"text-caption font-weight-semibold text-center lh-1-4\"},[_vm._v(\" Level up to see the next levels \")])],1):_vm._e(),_c('v-btn',{staticClass:\"slider-btn slider-btn--prev\",attrs:{\"fab\":\"\",\"ripple\":false,\"text\":\"\",\"x-small\":\"\"},on:{\"click\":function($event){return _vm.flickity.previous()}}},[_c('fai',{staticClass:\"text-body-1\",attrs:{\"fixed-width\":\"\",\"icon\":['fas', 'angle-down']}})],1),_c('v-btn',{staticClass:\"slider-btn slider-btn--next\",attrs:{\"fab\":\"\",\"ripple\":false,\"text\":\"\",\"x-small\":\"\"},on:{\"click\":function($event){return _vm.flickity.next()}}},[_c('fai',{staticClass:\"text-body-1\",attrs:{\"fixed-width\":\"\",\"icon\":['fas', 'angle-down']}})],1),_c('v-btn',{staticClass:\"slider-btn slider-btn--first\",attrs:{\"fab\":\"\",\"ripple\":false,\"text\":\"\",\"x-small\":\"\"},on:{\"click\":function($event){return _vm.flickity.select(0, false, true)}}},[_c('fai',{staticClass:\"text-caption\",attrs:{\"fixed-width\":\"\",\"icon\":['fas', 'chevron-double-down']}})],1),_c('v-btn',{staticClass:\"slider-btn slider-btn--last\",attrs:{\"fab\":\"\",\"ripple\":false,\"text\":\"\",\"x-small\":\"\"},on:{\"click\":function($event){return _vm.flickity.select(_vm.renderedLevels.length - 1, false, true)}}},[_c('fai',{staticClass:\"text-caption\",attrs:{\"fixed-width\":\"\",\"icon\":['fas', 'chevron-double-down']}})],1),_c('v-btn',{staticClass:\"slider-btn slider-btn--current\",attrs:{\"ripple\":false,\"fab\":\"\",\"text\":\"\",\"x-small\":\"\"},on:{\"click\":function($event){return _vm.flickity.select(_vm.renderedLevelIndex)}}},[_c('fai',{staticClass:\"text-caption\",attrs:{\"fixed-width\":\"\",\"icon\":['fas', 'undo']}})],1)],2)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div ref=\"levelSlider\" class=\"level-slider pb-8 pt-12\">\n    <div\n      v-for=\"[lsLevel, lsXp] in renderedLevels\"\n      :key=\"lsLevel\"\n      class=\"level-slide bg-ui-panel d-flex align-center flex-column mx-8 px-4 py-3\"\n      :class=\"{\n        'is-tier-upgrade py-4': lsLevel % config.tierUpgradeEvery === 0,\n      }\"\n    >\n      <AccountLevelsHeader\n        :icon-size=\"48\"\n        :level=\"lsLevel\"\n        :tier=\"toTier(lsLevel)\"\n        :xp=\"lsXp\" class=\"mb-2\"\n      />\n\n      <ul v-if=\"rewards[lsLevel].length\" class=\"pl-0 flex-grow-1 mb-2 green100--text text-caption\">\n        <li v-for=\"(reward, i) in rewards[lsLevel]\" :key=\"i\">\n          <span v-text=\"$t(`page.account.level_rewards.type.${reward.type}`, reward.data)\" />\n        </li>\n      </ul>\n      <p v-else class=\"text-caption mb-0 text--secondary\">\n        No rewards\n      </p>\n\n      <span v-if=\"rewards[lsLevel].length\" class=\"text-uppercase text-caption\">\n        <span v-if=\"claimedLevels.find(i => i === +lsLevel)\" class=\"green400--text font-weight-bold\">\n          <fai :icon=\"['fas', 'check']\" />\n          Claimed\n        </span>\n        <span v-else-if=\"isLevelClaimable(lsLevel)\" class=\"blue300--text font-weight-semibold\">\n          Unclaimed\n        </span>\n      </span>\n    </div>\n\n    <div\n      v-if=\"!renderedMaxLevel\"\n      class=\"level-slide bg-ui-panel d-flex align-center justify-center flex-column mx-8 pa-4 py-6\"\n    >\n      <fai\n        fixed-width :icon=\"['fas', 'chevron-double-down']\"\n        rotation=\"270\" class=\"blue200--text mb-4 text-h5\"\n      />\n      <span class=\"text-caption font-weight-semibold text-center lh-1-4\">\n        Level up to see the next levels\n      </span>\n    </div>\n\n    <v-btn\n      fab class=\"slider-btn slider-btn--prev\"\n      :ripple=\"false\" text x-small\n      @click=\"flickity.previous()\"\n    >\n      <fai fixed-width :icon=\"['fas', 'angle-down']\" class=\"text-body-1\" />\n    </v-btn>\n    <v-btn\n      fab class=\"slider-btn slider-btn--next\"\n      :ripple=\"false\" text x-small\n      @click=\"flickity.next()\"\n    >\n      <fai fixed-width :icon=\"['fas', 'angle-down']\" class=\"text-body-1\" />\n    </v-btn>\n\n    <v-btn\n      fab class=\"slider-btn slider-btn--first\"\n      :ripple=\"false\" text x-small\n      @click=\"flickity.select(0, false, true)\"\n    >\n      <fai fixed-width :icon=\"['fas', 'chevron-double-down']\" class=\"text-caption\" />\n    </v-btn>\n    <v-btn\n      fab class=\"slider-btn slider-btn--last\"\n      :ripple=\"false\" text x-small\n      @click=\"flickity.select(renderedLevels.length - 1, false, true)\"\n    >\n      <fai fixed-width :icon=\"['fas', 'chevron-double-down']\" class=\"text-caption\" />\n    </v-btn>\n\n    <v-btn\n      class=\"slider-btn slider-btn--current\"\n      :ripple=\"false\" fab text x-small\n      @click=\"flickity.select(renderedLevelIndex)\"\n    >\n      <fai fixed-width :icon=\"['fas', 'undo']\" class=\"text-caption\" />\n    </v-btn>\n  </div>\n</template>\n\n<script>\nimport Flickity from 'flickity'\nimport 'flickity/dist/flickity.min.css'\n\nimport { LEVELS } from '@/utils/constants'\nimport AccountLevelsHeader from './AccountLevelsHeader'\n\nconst MAX_RENDERED_LEVELS = 30\n\nfunction getLevelUserRewards(level, config) {\n  if (level < 1) return []\n\n  const { maxTier, tierUpgradeEvery } = config\n  const tier = Math.min(Math.floor(level / tierUpgradeEvery), maxTier)\n\n  const tierOverrides = config.overrides.tiers?.[tier] ?? {}\n  const levelOverrides = config.overrides.levels?.[level] ?? {}\n\n  const overrides = {\n    spins: tierOverrides.spins,\n    spinsAmount: levelOverrides.spins,\n    extras: [...(tierOverrides.extras ?? []), ...(levelOverrides.extras ?? [])],\n  }\n\n  const rewards = []\n\n  if (level % tierUpgradeEvery === 0) {\n    rewards.push({ type: 'tier_upgrade', data: { tier, level } })\n  }\n\n  // tier cases\n  const tierLevel = tier * tierUpgradeEvery\n  const tierProgress = (level - tierLevel) / tierUpgradeEvery\n\n  const spinsConfig = {\n    factor: overrides.spins?.factor ?? config.spins.factor,\n    min: overrides.spins?.min ?? config.spins.min,\n    max: overrides.spins?.max ?? config.spins.max,\n  }\n\n  const spinsFactor = spinsConfig.factor * (1 + tierProgress)\n  let spins = Math.round(Math.min(Math.max(spinsFactor, spinsConfig.min), spinsConfig.max))\n\n  if (overrides.spinsAmount) {\n    spins = overrides.spinsAmount\n  }\n\n  if (spins) {\n    rewards.push({\n      type: 'level_case',\n      data: { tier, level, amount: spins },\n    })\n  }\n\n\n  // extra rewards\n  if (overrides.extras.length) {\n    rewards.push(\n      ...overrides.extras.map(([extra, opts]) => ({\n        type: extra,\n        data: { tier, level, rewardOptions: opts },\n      })),\n    )\n  }\n\n  return rewards\n}\n\nexport default {\n  components: { AccountLevelsHeader },\n  props: {\n    loading: {\n      type: Boolean,\n      default: false,\n    },\n    xp: {\n      type: Number,\n      default: 0,\n    },\n    config: {\n      type: Object,\n      required: true,\n    },\n    claimedLevels: {\n      type: Array,\n      default: () => [],\n    },\n  },\n  data() {\n    return {\n      flickity: null,\n    }\n  },\n  computed: {\n    level() {\n      const nextLevel = LEVELS.findIndex(lvl => lvl > this.xp)\n\n      // we return nextLevel because index starts at 0 and first level is 1\n      return (nextLevel !== -1 ? nextLevel : LEVELS.length) - 1\n    },\n    tier() {\n      return this.toTier(this.level)\n    },\n    maxTier() {\n      return this.config.maxTier\n    },\n    renderedLevels() {\n      const { level } = this\n\n      const half = Math.round(MAX_RENDERED_LEVELS / 2)\n\n      const start = Math.max(0, level - half)\n      const end = Math.min(LEVELS.length, level + half)\n\n      const levels = LEVELS.map((xp, i) => [i, xp])\n\n      return levels.slice(start, end)\n    },\n    renderedLevelIndex() {\n      const { renderedLevels, level } = this\n\n      return renderedLevels.findIndex(([l]) => l === level)\n    },\n    renderedMaxLevel() {\n      const [maxXp] = LEVELS.slice(-1)\n      const [[, renderedMaxXp]] = this.renderedLevels.slice(-1)\n\n      return maxXp === renderedMaxXp\n    },\n    rewards() {\n      const { config } = this\n\n      return LEVELS.map((xp, level) => {\n        if (level === 0) return []\n\n        const rewards = getLevelUserRewards(level, config)\n\n        return rewards\n      })\n    },\n    claimable() {\n      const { claimedLevels, level } = this\n\n      return Object.keys(LEVELS).map(i => +i).filter(i => {\n        if (i === 0 || i > level) return false\n        return !claimedLevels.includes(i)\n      })\n    },\n  },\n  mounted() {\n    const { levelSlider: $levelSlider } = this.$refs\n\n    this.flickity = new Flickity($levelSlider, {\n      cellAlign: 'center',\n      cellSelector: '.level-slide',\n      initialIndex: this.renderedLevelIndex,\n      prevNextButtons: false,\n      pageDots: false,\n      wrapAround: false,\n    })\n  },\n  beforeDestroy() {\n    if (this.flickity) {\n      this.flickity.destroy()\n    }\n  },\n  methods: {\n    toTier(level) {\n      return Math.min(Math.floor(level / this.config.tierUpgradeEvery), this.maxTier)\n    },\n    isLevelClaimable(level) {\n      return this.claimable.includes(+level)\n    },\n  },\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.level-slider {\n  overflow: hidden;\n  position: relative;\n  outline: none;\n  background: url('../../../../assets/img/techtree.jpg') no-repeat center center;\n  background-size: cover;\n\n  &::before {\n    position: absolute;\n    z-index: 0;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: rgba(grey(800), 0.75);\n    content: ' ';\n    // pointer-events: none;\n  }\n\n  &::after {\n    position: absolute;\n    z-index: 1;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: radial-gradient(transparent 50%, rgba(grey(900), 0.8) 80%);\n    content: ' ';\n    pointer-events: none;\n  }\n\n  ::v-deep .flickity-viewport {\n    overflow: visible;\n    transition: height 0.2s ease;\n  }\n\n  .slider-btn {\n    position: absolute;\n    z-index: 2;\n    bottom: 8px;\n\n    &--prev {\n      left: 48px;\n      transform: rotate(90deg);\n    }\n\n    &--next {\n      right: 48px;\n      transform: rotate(-90deg);\n    }\n\n    &--first {\n      left: 12px;\n      transform: rotate(90deg);\n    }\n\n    &--last {\n      right: 12px;\n      transform: rotate(-90deg);\n    }\n\n    &--current {\n      left: 50%;\n      transform: translateX(-50%);\n    }\n  }\n}\n\n.header-level {\n  box-shadow: 0 0 30px rgba(green(400), 0.1), 0 0 20px rgba(green(400), 0.4);\n}\n\n.level-slide {\n  position: relative;\n  z-index: 1;\n  width: 164px;\n  transition: transform 0.3s ease;\n\n  &.is-tier-upgrade {\n    // background: grey(600);\n  }\n\n  &.is-hidden {\n    visibility: hidden;\n    opacity: 0 !important;\n  }\n\n  ul {\n    list-style-type: none;\n  }\n\n  ul > li::before {\n    position: relative;\n    margin-right: 0.5em;\n    content: '-'; /* en dash */\n  }\n\n  &::v-deep {\n    &:not(.is-tier-upgrade) {\n      .tier-icon {\n        // display: none;\n        width: 40px !important;\n        margin-top: -24px;\n      }\n    }\n\n    .tier-icon {\n      margin-top: -32px;\n      margin-bottom: 8px;\n      // background-color: grey(700) !important;\n    }\n\n    .level {\n      font-size: 14px !important;\n      line-height: 1.2;\n      white-space: nowrap;\n    }\n\n    .xp {\n      font-size: 10px !important;\n      white-space: nowrap;\n    }\n  }\n\n  &:hover {\n    transform: translateY(-3px);\n  }\n}\n</style>\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js!../../../../../node_modules/vuetify-loader/lib/loader.js??ref--17-0!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AccountLevelsSlider.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js!../../../../../node_modules/vuetify-loader/lib/loader.js??ref--17-0!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AccountLevelsSlider.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./AccountLevelsSlider.vue?vue&type=template&id=428e7314&scoped=true&\"\nimport script from \"./AccountLevelsSlider.vue?vue&type=script&lang=js&\"\nexport * from \"./AccountLevelsSlider.vue?vue&type=script&lang=js&\"\nimport style0 from \"./AccountLevelsSlider.vue?vue&type=style&index=0&id=428e7314&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  \"428e7314\",\n  null\n  \n)\n\nexport default component.exports\n\n/* vuetify-loader */\nimport installComponents from \"!../../../../../node_modules/vuetify-loader/lib/runtime/installComponents.js\"\nimport { VBtn } from 'vuetify/lib/components/VBtn';\ninstallComponents(component, {VBtn})\n","import mod from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../../node_modules/vuetify-loader/lib/loader.js??ref--17-0!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AccountLevelsSlider.vue?vue&type=style&index=0&id=428e7314&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../../node_modules/vuetify-loader/lib/loader.js??ref--17-0!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AccountLevelsSlider.vue?vue&type=style&index=0&id=428e7314&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"current-level text-center\"},[_c('v-img',{staticClass:\"tier-icon mx-auto grey400 mb-2\",attrs:{\"width\":_vm.iconSize,\"aspect-ratio\":1,\"contain\":\"\",\"src\":require((\"@/assets/img/levels/tiers/\" + _vm.tier + \"-large.png\"))}}),_c('h4',{staticClass:\"level green300--text text-body-1 font-weight-semibold\",domProps:{\"textContent\":_vm._s(_vm.$tc('common.level', _vm.level))}}),_c('h5',{staticClass:\"xp green200--text text-caption font-weight-semibold\"},[_vm._v(\" \"+_vm._s(_vm._f(\"toLocaleInt\")(_vm.xp))+\" XP \")])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"current-level text-center\">\n    <v-img\n      :width=\"iconSize\"\n      class=\"tier-icon mx-auto grey400 mb-2\"\n      :aspect-ratio=\"1\" contain\n      :src=\"require(`@/assets/img/levels/tiers/${tier}-large.png`)\"\n    />\n    <h4\n      class=\"level green300--text text-body-1 font-weight-semibold\"\n      v-text=\"$tc('common.level', level)\"\n    />\n    <h5 class=\"xp green200--text text-caption font-weight-semibold\">\n      {{ xp | toLocaleInt }} XP\n    </h5>\n  </div>\n</template>\n\n<script>\nexport default {\n  props: {\n    iconSize: {\n      type: Number,\n      default: 64,\n    },\n    xp: {\n      type: Number,\n      default: 0,\n    },\n    level: {\n      type: Number,\n      default: 0,\n    },\n    tier: {\n      type: Number,\n      default: 0,\n    },\n  },\n}\n</script>\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js!../../../../../node_modules/vuetify-loader/lib/loader.js??ref--17-0!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AccountLevelsHeader.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib/index.js!../../../../../node_modules/vuetify-loader/lib/loader.js??ref--17-0!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AccountLevelsHeader.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./AccountLevelsHeader.vue?vue&type=template&id=84b2fb78&\"\nimport script from \"./AccountLevelsHeader.vue?vue&type=script&lang=js&\"\nexport * from \"./AccountLevelsHeader.vue?vue&type=script&lang=js&\"\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  null,\n  null\n  \n)\n\nexport default component.exports\n\n/* vuetify-loader */\nimport installComponents from \"!../../../../../node_modules/vuetify-loader/lib/runtime/installComponents.js\"\nimport { VImg } from 'vuetify/lib/components/VImg';\ninstallComponents(component, {VImg})\n"],"sourceRoot":""}