@kiva/kv-components 6.7.0 → 6.8.1

package/dist/vue/KvUserAvatar.js

@@ -1,11 +1,11 @@
-import { toRefs as h, ref as v, computed as d, resolveComponent as y, openBlock as n, createElementBlock as o, normalizeClass as i, createElementVNode as s, createBlock as _, createCommentVNode as f, withDirectives as L, vShow as S, toDisplayString as C } from "vue";
-import { isLegacyPlaceholderAvatar as x, randomizedUserAvatarClass as k } from "../utils/imageUtils.js";
-import A from "./KvLoadingPlaceholder.js";
-import F from "../_virtual/_plugin-vue_export-helper.js";
-const U = {
+import { toRefs as y, ref as g, computed as d, resolveComponent as S, openBlock as n, createElementBlock as i, normalizeClass as r, createElementVNode as o, createBlock as _, normalizeStyle as L, createCommentVNode as u, withDirectives as C, vShow as x, toDisplayString as k } from "vue";
+import { isLegacyPlaceholderAvatar as A, randomizedUserAvatarClass as F } from "../utils/imageUtils.js";
+import U from "./KvLoadingPlaceholder.js";
+import H from "../_virtual/_plugin-vue_export-helper.js";
+const b = {
   name: "KvUserAvatar",
   components: {
-    KvLoadingPlaceholder: A
+    KvLoadingPlaceholder: U
   },
   props: {
     /**
@@ -30,86 +30,92 @@ const U = {
       default: !1
     }
   },
-  setup(m) {
+  setup(w) {
     const {
       lenderName: l,
       lenderImageUrl: t,
       isSmall: e
-    } = h(m), r = v(!0), c = d(() => l.value === "" && t.value === "" || l.value === "Anonymous"), w = () => {
+    } = y(w), s = g(!0), c = g(null), m = d(() => l.value === "" && t.value === "" || l.value === "Anonymous"), f = () => {
       const a = e != null && e.value ? "tw-w-3 tw-h-3 tw-text-h4" : "tw-w-6 tw-h-6 tw-text-h2";
-      return `${k()} ${a}`;
-    }, u = d(() => {
+      return `${F()} ${a}`;
+    }, h = d(() => {
       var a;
       return ((a = t == null ? void 0 : t.value) == null ? void 0 : a.split("/").pop()) ?? "";
-    }), g = d(() => {
+    }), v = d(() => {
       var a;
       return (a = l == null ? void 0 : l.value) == null ? void 0 : a.substring(0, 1).toUpperCase();
     });
     return {
-      isAnonymousUser: c,
-      avatarClass: w,
-      imageFilename: u,
-      lenderNameFirstLetter: g,
-      isLegacyPlaceholderAvatar: x,
-      isLoading: r,
+      isAnonymousUser: m,
+      avatarClass: f,
+      imageFilename: h,
+      lenderNameFirstLetter: v,
+      isLegacyPlaceholderAvatar: A,
+      isLoading: s,
       onImgLoad: () => {
-        r.value = !1;
-      }
+        s.value = !1;
+      },
+      imageRef: c
     };
   }
-}, H = { key: 1 }, b = ["src"], B = { class: "tw-self-center" };
-function I(m, l, t, e, r, c) {
-  const w = y("kv-loading-placeholder");
-  return n(), o("div", {
-    class: i(["data-hj-suppress tw-flex", { "tw-w-3": t.isSmall, "tw-w-6": !t.isSmall }])
+}, B = { key: 1 }, I = ["src"], p = { class: "tw-self-center" };
+function N(w, l, t, e, s, c) {
+  const m = S("kv-loading-placeholder");
+  return n(), i("div", {
+    class: r(["data-hj-suppress tw-flex", { "tw-w-3": t.isSmall, "tw-w-6": !t.isSmall }])
   }, [
-    e.isAnonymousUser ? (n(), o("div", {
+    e.isAnonymousUser ? (n(), i("div", {
       key: 0,
-      class: i(["tw-rounded-full tw-bg-brand tw-inline-flex tw-align-center tw-justify-center", { "tw-w-3 tw-h-3": t.isSmall, "tw-w-6 tw-h-6": !t.isSmall }])
+      class: r(["tw-rounded-full tw-bg-brand tw-inline-flex tw-align-center tw-justify-center", { "tw-w-3 tw-h-3": t.isSmall, "tw-w-6 tw-h-6": !t.isSmall }])
     }, [
-      (n(), o("svg", {
-        class: i(["tw-h-full tw-text-brand", { "tw-w-3 tw-h-3": t.isSmall }]),
+      (n(), i("svg", {
+        class: r(["tw-h-full tw-text-brand", { "tw-w-3 tw-h-3": t.isSmall }]),
         width: "25",
         height: "37",
         viewBox: "0 0 25 37",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
       }, l[1] || (l[1] = [
-        s("path", {
+        o("path", {
           d: "M8.22861 0.875H0.857178V36.3125H8.22861V0.875Z",
           fill: "white"
         }, null, -1),
-        s("path", {
+        o("path", {
           d: "M10.1143 23.2751C21.9428 23.2751 24.6857 13.2126 24.6857 11.4626H23.6571C11.8286 11.4626 9.08569 21.5251 9.08569 23.2751H10.1143Z",
           fill: "white"
         }, null, -1),
-        s("path", {
+        o("path", {
           d: "M9.08569 24.2376C9.08569 26.0751 11.1428 36.3126 23.8285 36.3126H24.8571C24.8571 34.4751 22.8 24.2376 10.1143 24.2376H9.08569Z",
           fill: "white"
         }, null, -1)
       ]), 2))
-    ], 2)) : !e.isLegacyPlaceholderAvatar(e.imageFilename) && e.imageFilename ? (n(), o("div", H, [
-      e.isLoading ? (n(), _(w, {
+    ], 2)) : !e.isLegacyPlaceholderAvatar(e.imageFilename) && e.imageFilename ? (n(), i("div", B, [
+      e.isLoading ? (n(), _(m, {
         key: 0,
-        class: i(["!tw-rounded-full", { "!tw-w-3 !tw-h-3": t.isSmall, "!tw-w-6 !tw-h-6": !t.isSmall }])
-      }, null, 8, ["class"])) : f("", !0),
-      L(s("img", {
+        style: L({
+          width: t.isSmall ? "1.5rem" : "3rem",
+          height: t.isSmall ? "1.5rem" : "3rem"
+        }),
+        class: "!tw-rounded-full"
+      }, null, 8, ["style"])) : u("", !0),
+      C(o("img", {
+        ref: "imageRef",
         src: t.lenderImageUrl,
         alt: "Image of lender",
-        class: i(["tw-rounded-full tw-inline-block", { "tw-w-3 tw-h-3": t.isSmall, "tw-w-6 tw-h-6": !t.isSmall }]),
-        onLoad: l[0] || (l[0] = (u) => e.onImgLoad())
-      }, null, 42, b), [
-        [S, !e.isLoading]
+        class: r(["tw-rounded-full tw-inline-block", { "tw-w-3 tw-h-3": t.isSmall, "tw-w-6 tw-h-6": !t.isSmall }]),
+        onLoad: l[0] || (l[0] = (f) => e.onImgLoad())
+      }, null, 42, I), [
+        [x, !e.isLoading]
       ])
-    ])) : e.isLegacyPlaceholderAvatar(e.imageFilename) || !e.imageFilename ? (n(), o("div", {
+    ])) : e.isLegacyPlaceholderAvatar(e.imageFilename) || !e.imageFilename ? (n(), i("div", {
       key: 2,
-      class: i(["tw-rounded-full tw-inline-flex tw-align-center tw-justify-center", e.avatarClass()])
+      class: r(["tw-rounded-full tw-inline-flex tw-align-center tw-justify-center", e.avatarClass()])
     }, [
-      s("span", B, C(e.lenderNameFirstLetter), 1)
-    ], 2)) : f("", !0)
+      o("span", p, k(e.lenderNameFirstLetter), 1)
+    ], 2)) : u("", !0)
   ], 2);
 }
-const K = /* @__PURE__ */ F(U, [["render", I]]);
+const M = /* @__PURE__ */ H(b, [["render", N]]);
 export {
-  K as default
+  M as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "6.7.0",
+  "version": "6.8.1",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -107,5 +107,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "cd2c1146ba70de5cde2dd547181a3e4489c627d3"
+  "gitHead": "26e1f18a4d9bb716f47da262f1eb9f9d84924a81"
 }