Avatar Bone

Introducción

Éste componente no está encargado de renderizar, es de uso interno del IrAvatar. Guía de uso parte lógica

Código fuente

<script>
const propsLocal = {
  text: {
    type: String,
    required: false
  },
  color: {
    type: String,
    default: 'primary'
  },
  img: {
    type: String,
    required: false
  },
  size: {
    type: [String, Number],
    default: '48'
  },
  icon: {
    type: String,
    required: false
  },
  iconAttrs: {
    type: Object,
    default: () => ({})
  }
}
import {
  normalizeProps,
  assignCamelToSnake
} from '../../helpers/propsGenerator'
import Vue from 'vue'
import { ref, h, onMounted } from 'vue'
const mergedProps = normalizeProps(propsLocal)
import { avatarComponentName } from '../../constants'
export default {
  name: avatarComponentName + 'Bone',
  props: mergedProps,
  setup(props, { slots }) {
    const propError = Vue.prototype.$propError
    const iclstore = Vue.prototype.$iclstore
    const structureError = ref(false)
    assignCamelToSnake(mergedProps, props)
    onMounted(() => {
      structureError.value = propError(propsLocal, props, avatarComponentName)
      if (structureError.value) {
        iclstore.commit('updateSnack', {
          text: 'Ha ocurrido un error al cargar el avatar',
          active: true,
          color: 'warning'
        })
      }
    })
    return () => {
      if (structureError.value) {
        return
      }
      return h(
        'div', // Contenedor como nodo raíz
        [
          slots.default({
            text: props.text,
            color: props.color,
            img: props.img,
            size: props.size,
            icon: props.icon,
            iconAttrs: props.iconAttrs
          })
        ]
      )
    }
  }
}
</script>