tyh-ui2/es/avatar/src/index.js

The next generation ui component library of tyh-ui is based on vue3 Version, fully embrace vue3.

import { defineComponent as y, ref as f, computed as a, openBlock as o, createElementBlock as s, normalizeClass as n, unref as t, normalizeStyle as u, renderSlot as g, createElementVNode as b } from "vue";
import { Props as z } from "./index2.js";
const _ = { class: "tyh-avatar" }, $ = ["draggable", "src", "alt"], k = y({
  name: "TyhAvatar"
}), B = /* @__PURE__ */ y({
  ...k,
  props: z,
  emits: ["error", "load"],
  setup(h, { emit: l }) {
    const r = h, c = f(!1), p = () => {
      l("error"), c.value = !0;
    }, d = a(() => ({
      width: `${r.size * 10}px`,
      height: `${r.size * 10}px`
    })), m = a(() => ["tyh-avatar-error", { "tyh-avatar-round": r.round }]), v = a(() => [
      {
        [`tyh-avatar-${r.fit}`]: r.fit,
        "tyh-avatar-round": r.round,
        "tyh-avatar-border": r.border,
        "tyh-avatar-select": r.select
      }
    ]);
    return (e, i) => (o(), s("div", _, [
      c.value ? (o(), s("div", {
        key: 0,
        class: n(t(m)),
        style: u(t(d))
      }, [
        g(e.$slots, "error", {}, () => [
          b("i", {
            class: n(["tyh-icon", e.errorIcon || "tyh-ui-user"])
          }, null, 2)
        ])
      ], 6)) : (o(), s("img", {
        key: 1,
        draggable: e.draggable,
        class: n(t(v)),
        style: u(t(d)),
        src: e.src,
        alt: e.alt,
        onError: p,
        onLoad: i[0] || (i[0] = (C) => l("load"))
      }, null, 46, $))
    ]));
  }
});
export {
  B as default
};