{"version":3,"file":"AlertsCustomVisualizationGas-b640a424.js","sources":["../../../app/javascript/components/alerts/custom/visualization/AlertsCustomVisualizationGas.vue"],"sourcesContent":["<template>\n  <div v-if=\"isDataReady\">\n    <div class=\"h-full w-full space-y-4\">\n      <div class=\"rounded border border-gray-800 bg-gray-800/25 p-3\">\n        <ChartGasFee />\n      </div>\n      <div v-if=\"gasFees.length != 0\">\n        <div class=\"w-full rounded border border-gray-800 bg-gray-800/25\">\n          <div class=\"flex flex-col p-3\">\n            <table>\n              <thead>\n                <tr class=\"border-none\">\n                  <th></th>\n                  <th class=\"px-3 py-0 text-right text-xs font-normal normal-case text-gray-300\">Standard</th>\n                  <th class=\"px-3 py-0 text-right text-xs font-normal normal-case text-gray-300\">Fast</th>\n                  <th class=\"px-3 py-0 !text-right text-xs font-normal normal-case text-gray-300\">Instant</th>\n                </tr>\n              </thead>\n              <tbody>\n                <tr class=\"border-none\">\n                  <td class=\"py-0\"></td>\n                  <template v-for=\"(fee, idx) in gweiFee\" :key=\"idx\">\n                    <td class=\"whitespace-nowrap px-3 text-right text-xs font-medium\">\n                      {{ decimals(fee.gwei, 0, 0) }} Gwei\n                    </td>\n                  </template>\n                </tr>\n                <tr v-for=\"(gf, idx) in gasFees\" class=\"border-none\" :key=\"idx\">\n                  <td class=\"whitespace-nowrap px-3 py-1 text-xs text-gray-300\">{{ gf.description }}</td>\n                  <td class=\"px-3 py-1 text-right\">\n                    <span class=\"text-xs text-white\">${{ decimals(gf.fees.standard.usd, 2, 2) }}</span>\n                  </td>\n                  <td class=\"px-3 py-1 text-right\">\n                    <span class=\"text-xs text-white\">${{ decimals(gf.fees.fast.usd, 2, 2) }}</span>\n                  </td>\n                  <td class=\"px-3 py-1 text-right\">\n                    <span class=\"text-xs text-white\">${{ decimals(gf.fees.instant.usd, 2, 2) }}</span>\n                  </td>\n                </tr>\n              </tbody>\n            </table>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div v-else class=\"flex flex-col pr-8\">\n    <BaseLoader class=\"m-auto h-5 w-5\" />\n  </div>\n</template>\n<script setup>\nimport table from '@/mixins/table';\nimport useHttp from '@/composeables/http';\nimport { decimals } from '@/composeables/filters';\nimport { ref, onMounted, computed } from 'vue';\nimport ChartGasFee from '@/components/chart/ChartGasFee.vue';\nimport { useStore } from 'vuex';\n\nconst $http = useHttp();\nconst $store = useStore();\n\nconst gasFees = computed(() => {\n  return $store.getters.gasFees;\n});\n\nconst isDataReady = computed(() => {\n  return $store.getters.gasFeesLoader == false;\n});\n\nconst gweiFee = computed(() => {\n  return gasFees.value?.['swap_transaction']?.fees || {};\n});\n</script>\n"],"names":["useHttp","$store","useStore","gasFees","computed","isDataReady","gweiFee","_b","_a"],"mappings":"w4CA0DcA,EAAU,EACxB,MAAMC,EAASC,EAAQ,EAEjBC,EAAUC,EAAS,IAChBH,EAAO,QAAQ,OACvB,EAEKI,EAAcD,EAAS,IACpBH,EAAO,QAAQ,eAAiB,EACxC,EAEKK,EAAUF,EAAS,IAAM,SAC7B,QAAOG,GAAAC,EAAAL,EAAQ,QAAR,YAAAK,EAAgB,mBAAhB,YAAAD,EAAqC,OAAQ,CAAA,CACtD,CAAC"}