{"version":3,"file":"avatar.vue.mjs","sources":["../../../../../packages/components/avatar/src/avatar.vue"],"sourcesContent":["<template>\n  <span :class=\"avatarClass\" :style=\"sizeStyle\">\n    <img\n      v-if=\"(src || srcSet) && !hasLoadError\"\n      :src=\"src\"\n      :alt=\"alt\"\n      :srcset=\"srcSet\"\n      :style=\"fitStyle\"\n      @error=\"handleError\"\n    />\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <slot v-else></slot>\n  </span>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, watch } from 'vue'\nimport { ElIcon } from '@element-ultra/components/icon'\nimport { useNamespace } from '@element-ultra/hooks'\nimport { isNumber, isString, addUnit } from '@element-ultra/utils'\nimport { avatarEmits, avatarProps } from './avatar'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAvatar',\n  components: {\n    ElIcon,\n  },\n  props: avatarProps,\n  emits: avatarEmits,\n\n  setup(props, { emit }) {\n    const ns = useNamespace('avatar')\n\n    const hasLoadError = ref(false)\n\n    const avatarClass = computed(() => {\n      const { size, icon, shape } = props\n      const classList = [ns.b()]\n      if (isString(size)) classList.push(ns.m(size))\n      if (icon) classList.push(ns.m('icon'))\n      if (shape) classList.push(ns.m(shape))\n      return classList\n    })\n\n    const sizeStyle = computed(() => {\n      const { size } = props\n      return isNumber(size)\n        ? ({\n            '--el-avatar-size': addUnit(size),\n          } as CSSProperties)\n        : undefined\n    })\n\n    const fitStyle = computed<CSSProperties>(() => ({\n      objectFit: props.fit,\n    }))\n\n    // need reset hasLoadError to false if src changed\n    watch(\n      () => props.src,\n      () => (hasLoadError.value = false)\n    )\n\n    function handleError(e: Event) {\n      hasLoadError.value = true\n      emit('error', e)\n    }\n\n    return {\n      hasLoadError,\n      avatarClass,\n      sizeStyle,\n      fitStyle,\n      handleError,\n    }\n  },\n})\n</script>\n"],"names":["_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_createBlock","_withCtx","_renderSlot"],"mappings":";;;;;;6BACEA,iBAaO,SAAA,CAAA,CAAA;AAb0B,EAAA,OAAAC,WAAA,EAAAC,kBAAA;AAAA,IAAW,MAAA;AAAA,IAAA;AAAA,MAAA,KAAA,EAAAC,cAAA,CAAA,IAAA,CAAA,WAAA,CAAA;AAAA,MAEjC,KAAA,EAAAC,cAAO,CAAA,IAAA,CAAM,SAAM,CAAA;AAAA,KAAA;AAAA;oEACjB,EAAAF,kBAAA,CAAA,KAAA,EAAA;AAAA,QACR,GAAK,EAAA,CAAA;AAAA,QACL,KAAQ,IAAA,CAAA,GAAA;AAAA,QACR,KAAK,IAAA,CAAA,GAAA;AAAA,QACL,QAAK,IAAA,CAAA,MAAA;AAAA,QAAA,KAAA,EAAAE,cAAA,CAAA,IAAA,CAAA,QAAA,CAAA;AAAA,QAEY,OAAI,EAAA,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA,GAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,WAAA,IAAA,IAAA,CAAA,WAAA,CAAA,GAAA,IAAA,CAAA,CAAA;AAAA,OAEd,EAAA,IAAA,EAAA,EAAA,EAAA,UAAA,KAAA,IAAA,CAAA,IAAA,IAAAH,SAAA,EAAA,EAAAI,WADR,CAAA,kBAAA,EAAwB,EAAR,GAAA,EAAA,GAAA,EAAA;AAAA,QAAA,OAAA,EAAAC,QAAA,MAAA;AAAA;;QAElB,CAAA,EAAA,CAAA;AAAA;AAAA,OAAA,KAAAC,UAAA,CAAA,IAAA,CAAA,QAAA,SAAA,EAAA,EAAA,GAAA,EAAA,CAAA,EAAA,CAAA;AAAA;;;;;;;;;"}