{"version":3,"file":"BalAsset-4fe8e509.js","sources":["../../src/components/_global/BalLoadingBlock/BalLoadingBlock.vue","../../src/composables/useUrls.ts","../../src/components/images/Avatar.vue","../../src/components/_global/BalAsset/BalAsset.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport useDarkMode from '@/composables/useDarkMode';\n\n/**\n * TYPES\n */\ntype RoundedOpts = 'sm' | 'md' | 'lg';\n\ntype Props = {\n  white?: boolean;\n  darker?: boolean;\n  square?: boolean;\n  rounded?: RoundedOpts;\n};\n\n/**\n * PROPS & EMITS\n */\nconst props = withDefaults(defineProps<Props>(), {\n  white: false,\n  darker: false,\n  square: false,\n  rounded: 'lg',\n});\n\n/**\n * COMPOSABLES\n */\nconst { darkMode } = useDarkMode();\n\n/**\n * COMPUTED\n */\nconst bgClass = computed(() => {\n  if (props.white) return 'shimmer-white';\n  if (darkMode.value) {\n    return props.darker ? 'shimmer-dark-mode-darker' : 'shimmer-dark-mode';\n  }\n  return props.darker ? 'shimmer-light-mode-darker' : 'shimmer-light-mode';\n});\n\nconst classes = computed(() => {\n  return {\n    [`rounded-${props.rounded}`]: !props.square,\n    [bgClass.value]: true,\n  };\n});\n</script>\n\n<template>\n  <div :class=\"['bal-loading-block', classes]\" />\n</template>\n\n<style>\n.bal-loading-block {\n  min-height: 5px;\n}\n\n@keyframes shimmerBackground {\n  0% {\n    background-position: -5000px 0;\n  }\n\n  100% {\n    background-position: 5000px 0;\n  }\n}\n\n.shimmer-white {\n  --start-color: rgb(255 255 255 / 10%);\n  --mid-color: rgb(255 255 255 / 20%);\n  --end-color: rgb(255 255 255 / 10%);\n\n  animation: shimmerBackground 10s infinite;\n  background: linear-gradient(\n    to right,\n    var(--start-color) 4%,\n    var(--mid-color) 25%,\n    var(--end-color) 36%\n  );\n  background-size: 1000px 100%;\n}\n\n.shimmer-light-mode {\n  --start-color: theme('colors.gray.50');\n  --mid-color: theme('colors.gray.100');\n  --end-color: theme('colors.gray.50');\n\n  animation: shimmerBackground 10s infinite;\n  background: linear-gradient(\n    to right,\n    var(--start-color) 4%,\n    var(--mid-color) 25%,\n    var(--end-color) 36%\n  );\n  background-size: 1000px 100%;\n}\n\n.shimmer-light-mode-darker {\n  --start-color: theme('colors.gray.100');\n  --mid-color: theme('colors.gray.200');\n  --end-color: theme('colors.gray.100');\n\n  animation: shimmerBackground 10s infinite;\n  background: linear-gradient(\n    to right,\n    var(--start-color) 4%,\n    var(--mid-color) 25%,\n    var(--end-color) 36%\n  );\n  background-size: 1000px 100%;\n}\n\n.shimmer-dark-mode {\n  --start-color: theme('colors.gray.850');\n  --mid-color: theme('colors.gray.800');\n  --end-color: theme('colors.gray.850');\n\n  animation: shimmerBackground 10s infinite;\n  background: linear-gradient(\n    to right,\n    var(--start-color) 4%,\n    var(--mid-color) 25%,\n    var(--end-color) 36%\n  );\n  background-size: 1000px 100%;\n}\n\n.shimmer-dark-mode-darker {\n  --start-color: theme('colors.gray.700');\n  --mid-color: theme('colors.gray.600');\n  --end-color: theme('colors.gray.700');\n\n  animation: shimmerBackground 10s infinite;\n  background: linear-gradient(\n    to right,\n    var(--start-color) 4%,\n    var(--mid-color) 25%,\n    var(--end-color) 36%\n  );\n  background-size: 1000px 100%;\n}\n</style>\n","import { configService } from '@/services/config/config.service';\n\nfunction resolve(uri: string): string {\n  if (!uri) return '';\n  return uri\n    .replace('ipfs://', `https://${configService.env.IPFS_NODE}/ipfs/`)\n    .replace('ipns://', `https://${configService.env.IPFS_NODE}/ipns/`);\n}\n\nexport default function useUrls() {\n  return { resolve };\n}\n","<script lang=\"ts\" setup>\nimport { computed, onMounted, ref, watch } from 'vue';\n\nimport useUrls from '@/composables/useUrls';\n\n/**\n * TYPES\n */\ntype Props = {\n  address: string;\n  iconURI?: string;\n  size?: number;\n};\n\n/**\n * PROPS & EMITS\n */\nconst props = withDefaults(defineProps<Props>(), {\n  iconURI: '',\n  size: 24,\n});\n\n/**\n * COMPOSABLES\n */\nconst { resolve } = useUrls();\n\n/**\n * STATE\n */\nconst error = ref(false);\nconst isMounted = ref(false);\n\n/**\n * COMPUTED\n */\nconst iconSRC = computed(() => resolve(props.iconURI));\n\n/**\n * WATCHERS\n */\nwatch(iconSRC, newURL => {\n  if (newURL !== '') error.value = false;\n});\n\n/**\n * LIFECYCLE\n */\nonMounted(() => (isMounted.value = true));\n</script>\n\n<template>\n  <img\n    v-if=\"iconSRC && !error\"\n    :src=\"iconSRC\"\n    :style=\"{\n      width: `${size}px`,\n      height: `${size}px`,\n      background: 'white',\n    }\"\n    class=\"inline-block leading-none rounded-full shadow-sm\"\n    @error=\"error = true\"\n  />\n  <div\n    v-else\n    class=\"overflow-hidden leading-none rounded-full\"\n    :style=\"{\n      width: `${size}px`,\n      height: `${size}px`,\n    }\"\n  >\n    <Jazzicon v-if=\"isMounted\" :address=\"address\" :diameter=\"size\" />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { useTokens } from '@/providers/tokens.provider';\nimport useUrls from '@/composables/useUrls';\nimport { TokenInfo } from '@/types/TokenList';\n\nimport Avatar from '../../images/Avatar.vue';\n\ntype Props = {\n  address?: string;\n  iconURI?: string;\n  size?: number;\n  button?: boolean;\n  disabled?: boolean;\n};\n\nconst props = withDefaults(defineProps<Props>(), {\n  address: '',\n  iconURI: '',\n  size: 24,\n  button: false,\n  disabled: false,\n});\n\n/**\n * COMPOSABLES\n */\nconst { getToken } = useTokens();\nconst { resolve } = useUrls();\n\n/**\n * STATE\n */\nconst { address } = toRefs(props);\nconst error = ref(false);\n\n/**\n * COMPUTED\n */\nconst token = computed<TokenInfo | undefined>(() =>\n  address.value ? getToken(address.value) : undefined\n);\n\nconst iconSRC = computed(() => {\n  if (props.iconURI) return resolve(props.iconURI);\n\n  if (!token.value?.logoURI) return '';\n  return resolve(token.value.logoURI);\n});\n\nconst rootElement = computed(() => (props.button ? 'button' : 'div'));\n\nconst rootElementAttrs = computed(() => ({\n  'aria-label': token.value?.symbol,\n  disabled: props.disabled,\n}));\n\n/**\n * WATCHERS\n */\nwatch(iconSRC, newURL => {\n  if (newURL !== '') error.value = false;\n});\n</script>\n\n<template>\n  <component\n    :is=\"rootElement\"\n    :title=\"token?.symbol\"\n    class=\"inline-block leading-none rounded-full shadow-sm bal-asset\"\n    :style=\"{\n      width: `${size}px`,\n      height: `${size}px`,\n    }\"\n    v-bind=\"rootElementAttrs\"\n  >\n    <img\n      v-if=\"iconSRC && !error\"\n      :src=\"iconSRC\"\n      alt=\"icon\"\n      :width=\"size\"\n      :height=\"size\"\n      class=\"bg-white rounded-full\"\n      loading=\"lazy\"\n      @error=\"error = true\"\n    />\n    <Avatar v-else-if=\"!!address\" :address=\"address\" :size=\"size\" />\n    <div\n      v-else\n      class=\"overflow-visible bg-gray-300 dark:bg-gray-700 rounded-full\"\n      :style=\"{\n        width: `${size}px`,\n        height: `${size}px`,\n      }\"\n    />\n  </component>\n</template>\n\n<style scoped>\nbutton.bal-asset {\n  @apply transition-transform shadow;\n}\n\nbutton:disabled.bal-asset {\n  @apply opacity-20 cursor-not-allowed;\n}\n\nbutton:not([disabled]).bal-asset:hover,\nbutton:not([disabled]).bal-asset:focus {\n  @apply scale-110 transform-gpu;\n\n  box-shadow: 0 4px 8px rgb(0 0 0 / 15%);\n}\n</style>\n"],"names":["darkMode","useDarkMode","bgClass","computed","props","classes","resolve","uri","configService","useUrls","error","ref","isMounted","iconSRC","watch","newURL","onMounted","getToken","useTokens","address","toRefs","token","_a","rootElement","rootElementAttrs"],"mappings":"+WA4BA,CAAA,SAAAA,GAAAC,IAKAC,EAAAC,EAAA,IACEC,EAAA,MAAiB,gBACjBJ,EAAA,MACEI,EAAA,OAAA,2BAAA,oBAEFA,EAAA,OAAA,4BAAA,oBAAoD,EAGtDC,EAAAF,EAAA,KACE,CAAO,CAAA,WAAAC,EAAA,OAAA,EAAA,EAAA,CAAAA,EAAA,OACgC,CAAAF,EAAA,KAAA,EAAA,EACpB,EACnB,8EC3CF,SAASI,EAAQC,EAAqB,CACpC,OAAKA,EACEA,EACJ,QAAQ,UAAW,WAAWC,EAAc,IAAI,SAAS,QAAQ,EACjE,QAAQ,UAAW,WAAWA,EAAc,IAAI,SAAS,QAAQ,EAHnD,EAInB,CAEA,SAAwBC,GAAU,CAChC,MAAO,CAAE,QAAAH,CAAQ,CACnB,qHCcA,CAAA,QAAAA,GAAAG,IAKAC,EAAAC,EAAA,EAAA,EACAC,EAAAD,EAAA,EAAA,EAKAE,EAAAV,EAAA,IAAAG,EAAAF,EAAA,OAAA,CAAA,EAKA,OAAAU,EAAAD,EAAAE,GAAA,CACEA,IAAA,KAAmBL,EAAA,MAAA,GAAc,CAAA,EAMnCM,EAAA,IAAAJ,EAAA,MAAA,EAAA,yrBCtBA,CAAA,SAAAK,GAAAC,IACA,CAAA,QAAAZ,GAAAG,IAKA,CAAA,QAAAU,CAAA,EAAAC,EAAAhB,CAAA,EACAM,EAAAC,EAAA,EAAA,EAKAU,EAAAlB,EAAc,IAAAgB,EAAA,MAAAF,EAAAE,EAAA,KAAA,EAAA,MAC8B,EAG5CN,EAAAV,EAAA,IAAA,OACE,OAAAC,EAAA,QAAmBE,EAAAF,EAAA,OAAA,GAEnBkB,EAAAD,EAAA,QAAA,MAAAC,EAAA,QACAhB,EAAAe,EAAA,MAAA,OAAA,EAD2B,EACO,CAAA,EAGpCE,EAAApB,EAAA,IAAAC,EAAA,OAAA,SAAA,KAAA,EAEAoB,EAAArB,EAAA,IAAA,OAAA,OAAyC,cAAAmB,EAAAD,EAAA,QAAA,YAAAC,EAAA,OACZ,SAAAlB,EAAA,QACX,EAAA,EAMlB,OAAAU,EAAAD,EAAAE,GAAA,CACEA,IAAA,KAAmBL,EAAA,MAAA,GAAc,CAAA"}