/**
 * ldesign v0.2.14
 * (c) 2022/11/2 16:16 built by swimly
 * @license MIT
 */

import Vue from 'vue';
import { renderContent, renderLNodeJSX } from '../../utils/render-node.js';
import { getClassPrefixMixins } from '../config-provider/config-receiver.js';
import mixins from '../../utils/mixins.js';
import { AvatarProps } from './props.js';
import 'lodash';
import 'lodash/mergeWith';
import '../config-provider/context.js';
import '../../chunks/zh_CN.js';
import '../config-provider/type.js';

const classPrefixMixins = getClassPrefixMixins("avatar");
var _Avatar = mixins(Vue, classPrefixMixins).extend({
  name: "LAvatar",
  props: {
    ...AvatarProps
  },
  data() {
    return {
      isImgExist: true,
      gap: 4,
      sizeValue: "",
      scale: ""
    };
  },
  inject: {
    avatarGroup: {
      default: void 0
    }
  },
  computed: {
    customAvatarSize() {
      return this.isCustomSize() ? {
        "width": this.sizeValue,
        "height": this.sizeValue,
        "font-size": `${Number.parseInt(this.sizeValue, 10) / 2}px`
      } : {};
    },
    customImageSize() {
      return this.isCustomSize() ? {
        height: this.sizeValue,
        width: this.sizeValue
      } : {};
    },
    customCharacterSize() {
      return {
        transform: this.scale
      };
    }
  },
  mounted() {
    const {
      avatarGroup
    } = this;
    this.sizeValue = this.size || (avatarGroup === null || avatarGroup === void 0 ? void 0 : avatarGroup.size);
    this.$nextTick(() => {
      this.setScaleParams();
    });
  },
  methods: {
    handleImgLoadError() {
      const {
        onError,
        hideOnLoadFailed
      } = this.$props;
      this.isImgExist = !hideOnLoadFailed;
      onError && onError();
      this.$emit("error");
    },
    setScaleParams() {
      const avatar = this.$refs.avatar;
      const avatarChild = this.$refs.avatarChild;
      const avatarWidth = avatar === null || avatar === void 0 ? void 0 : avatar.offsetWidth;
      const avatarChildWidth = avatarChild === null || avatarChild === void 0 ? void 0 : avatarChild.offsetWidth;
      if (this.gap * 2 < avatarWidth) {
        this.scale = avatarChildWidth > avatarWidth - this.gap * 2 ? `scale(${(avatarWidth - this.gap * 2) / avatarChildWidth})` : "scale(1)";
      }
    },
    isCustomSize() {
      return this.sizeValue && !this.commonSizeClassName[this.sizeValue];
    }
  },
  updated() {
    this.$nextTick(() => {
      this.setScaleParams();
    });
  },
  render() {
    const h = arguments[0];
    let content = renderContent(this, "default", "content");
    const icon = renderLNodeJSX(this, "icon");
    const isIconOnly = icon && !content;
    const {
      shape,
      image,
      alt
    } = this.$props;
    const avatarClass = [this.componentName, this.commonSizeClassName[this.sizeValue], {
      [`${this.componentName}--circle`]: shape === "circle",
      [`${this.componentName}--round`]: shape === "round",
      [`${this.componentName}__icon`]: !!isIconOnly
    }];
    content = h("span", {
      "ref": "avatarChild",
      "style": {
        ...this.customCharacterSize
      }
    }, [content]);
    if (icon) content = [icon, !isIconOnly ? content : ""];
    if (image && this.isImgExist) {
      content = h("img", {
        "style": {
          ...this.customImageSize
        },
        "attrs": {
          "src": image,
          "alt": alt
        },
        "on": {
          "error": this.handleImgLoadError
        }
      });
    }
    return h("div", {
      "ref": "avatar",
      "class": avatarClass,
      "style": {
        ...this.customAvatarSize
      }
    }, [content]);
  }
});

export { _Avatar as default };
//# sourceMappingURL=avatar.js.map
