@nextcloud/vue
Version:
Nextcloud vue components
52 lines (51 loc) • 3.04 kB
JavaScript
import "../assets/index43.css";
import { n as r } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
import { N as a } from "../chunks/index-7aa3fc24.mjs";
import s from "./NcPopover.mjs";
const n = { name: "NcUserBubbleDiv" };
var i = function() {
var t = this, e = t._self._c;
return e("div", [t._t("trigger")], 2);
}, o = [], l = r(n, i, o, !1, null, null, null, null);
const u = l.exports;
const p = { name: "NcUserBubble", components: { NcAvatar: a, NcPopover: s, NcUserBubbleDiv: u }, props: { avatarImage: { type: String, default: void 0 }, user: { type: String, default: void 0 }, displayName: { type: String, required: !0 }, showUserStatus: { type: Boolean, default: !1 }, url: { type: String, default: void 0, validator: (t) => {
try {
return t = new URL(t), !!t;
} catch {
return !1;
}
} }, open: { type: Boolean, default: !1 }, primary: { type: Boolean, default: !1 }, size: { type: Number, default: 20 }, margin: { type: Number, default: 2 } }, emits: ["click", "update:open"], computed: { isPopoverComponent() {
return this.popoverEmpty ? "NcUserBubbleDiv" : "NcPopover";
}, isAvatarUrl() {
if (!this.avatarImage)
return !1;
try {
return !!new URL(this.avatarImage);
} catch {
return !1;
}
}, isCustomAvatar() {
return !!this.avatarImage;
}, hasUrl() {
return this.url && this.url.trim() !== "";
}, isLinkComponent() {
return this.hasUrl ? "a" : "div";
}, popoverEmpty() {
return !("default" in this.$slots);
}, styles() {
return { content: { height: this.size + "px", lineHeight: this.size + "px", borderRadius: this.size / 2 + "px" }, avatar: { marginLeft: this.margin + "px" } };
} }, methods: { onOpenChange(t) {
this.$emit("update:open", t);
}, onClick(t) {
this.$emit("click", t);
} } };
var m = function() {
var t = this, e = t._self._c;
return e(t.isPopoverComponent, { tag: "component", staticClass: "user-bubble__wrapper", attrs: { trigger: "hover focus", shown: t.open }, on: { "update:open": t.onOpenChange }, scopedSlots: t._u([{ key: "trigger", fn: function() {
return [e(t.isLinkComponent, { tag: "component", staticClass: "user-bubble__content", class: t.primary ? "user-bubble__content--primary" : "", style: t.styles.content, attrs: { href: t.hasUrl ? t.url : null }, on: { click: t.onClick } }, [e("NcAvatar", t._b({ staticClass: "user-bubble__avatar", style: t.styles.avatar, attrs: { url: t.isCustomAvatar && t.isAvatarUrl ? t.avatarImage : void 0, "icon-class": t.isCustomAvatar && !t.isAvatarUrl ? t.avatarImage : void 0, user: t.user, "display-name": t.displayName, size: t.size - t.margin * 2, "disable-tooltip": !0, "disable-menu": !0 } }, "NcAvatar", t.$props, !1)), e("span", { staticClass: "user-bubble__name" }, [t._v(" " + t._s(t.displayName || t.user) + " ")]), t.$slots.name ? e("span", { staticClass: "user-bubble__secondary" }, [t._t("name")], 2) : t._e()], 1)];
}, proxy: !0 }], null, !0) }, [t._t("default")], 2);
}, c = [], v = r(p, m, c, !1, null, "25c04da2", null, null);
const g = v.exports;
export {
g as default
};