@nextcloud/vue 8.30.0 → 8.32.0

package/dist/chunks/NcUserBubble-8Mts76ii.mjs

@@ -0,0 +1,222 @@
+import '../assets/NcUserBubble-uIpJvFoQ.css';
+import Vue from "vue";
+import { RouterLink } from "vue-router";
+import { n as normalizeComponent } from "./_plugin-vue2_normalizer-DU4iP6Vu.mjs";
+import { N as NcAvatar } from "./NcAvatar-Cupl4prm.mjs";
+import { N as NcPopover } from "./NcPopover-nzbq2IjT.mjs";
+const _sfc_main$1 = {
+  name: "NcUserBubbleDiv"
+};
+var _sfc_render$1 = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", [_vm._t("trigger")], 2);
+};
+var _sfc_staticRenderFns$1 = [];
+var __component__$1 = /* @__PURE__ */ normalizeComponent(
+  _sfc_main$1,
+  _sfc_render$1,
+  _sfc_staticRenderFns$1,
+  false,
+  null,
+  null
+);
+const NcUserBubbleDiv = __component__$1.exports;
+const _sfc_main = {
+  name: "NcUserBubble",
+  components: {
+    NcAvatar,
+    NcPopover,
+    NcUserBubbleDiv
+  },
+  props: {
+    /**
+     * Override generated avatar, can be an url or an icon class
+     */
+    avatarImage: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Provide the user id if this is a user
+     */
+    user: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Displayed label
+     */
+    displayName: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Whether or not to display the user-status
+     */
+    showUserStatus: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Define the whole bubble as a link
+     */
+    url: {
+      type: String,
+      default: void 0,
+      validator: (url) => {
+        var _a;
+        try {
+          new URL(url, ((_a = url == null ? void 0 : url.startsWith) == null ? void 0 : _a.call(url, "/")) ? window.location.href : void 0);
+          return true;
+        } catch (e) {
+          return false;
+        }
+      }
+    },
+    /**
+     * Use bubble as a router-link for in-app navigation
+     */
+    to: {
+      type: [String, Object],
+      default: void 0
+    },
+    /**
+     * Default popover state. Requires the UserBubble
+     * to have some content to render inside the popover
+     */
+    open: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Use the primary colour
+     */
+    primary: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * This is the height of the component
+     */
+    size: {
+      type: Number,
+      default: 20
+    },
+    /**
+     * This is the margin of the avatar (size - margin = avatar size)
+     */
+    margin: {
+      type: Number,
+      default: 2
+    }
+  },
+  emits: [
+    "click",
+    "update:open"
+  ],
+  computed: {
+    /**
+     * If userbubble is empty, let's NOT
+     * use the Popover component
+     * We need a component instead of a simple div here,
+     * because otherwise the trigger template will not be shown.
+     *
+     * @return {string} 'Popover' or 'UserBubbleDiv'
+     */
+    isPopoverComponent() {
+      return !this.popoverEmpty ? "NcPopover" : "NcUserBubbleDiv";
+    },
+    /**
+     * Is the provided avatar url valid or not
+     *
+     * @return {boolean}
+     */
+    isAvatarUrl() {
+      if (!this.avatarImage) {
+        return false;
+      }
+      try {
+        const url = new URL(this.avatarImage);
+        return !!url;
+      } catch (e) {
+        return false;
+      }
+    },
+    /**
+     * Do we have a custom avatar or not
+     *
+     * @return {boolean}
+     */
+    isCustomAvatar() {
+      return !!this.avatarImage;
+    },
+    hasUrl() {
+      return this.url && this.url.trim() !== "";
+    },
+    isLinkComponent() {
+      if (this.hasUrl) {
+        return "a";
+      } else if (this.to) {
+        return RouterLink;
+      } else {
+        return "div";
+      }
+    },
+    popoverEmpty() {
+      if ("default" in this.$slots) {
+        return false;
+      }
+      return true;
+    },
+    styles() {
+      return {
+        content: {
+          height: this.size + "px",
+          lineHeight: this.size + "px",
+          borderRadius: this.size / 2 + "px"
+        },
+        avatar: {
+          marginInlineStart: this.margin + "px"
+        }
+      };
+    }
+  },
+  mounted() {
+    if (!this.displayName && !this.user) {
+      Vue.util.warn("[NcUserBubble] At least `displayName` or `user` property should be set.");
+    }
+  },
+  methods: {
+    onOpenChange(state) {
+      this.$emit("update:open", state);
+    },
+    /**
+     * Catch and forward click event to parent
+     *
+     * @param {Event} event the click event
+     */
+    onClick(event) {
+      this.$emit("click", event);
+    }
+  }
+};
+var _sfc_render = function render2() {
+  var _vm = this, _c = _vm._self._c;
+  return _c(_vm.isPopoverComponent, { tag: "component", staticClass: "user-bubble__wrapper", attrs: { "trigger": "hover focus", "shown": _vm.open }, on: { "update:open": _vm.onOpenChange }, scopedSlots: _vm._u([{ key: "trigger", fn: function({ attrs }) {
+    return [_c(_vm.isLinkComponent, _vm._b({ tag: "component", staticClass: "user-bubble__content", class: { "user-bubble__content--primary": _vm.primary }, style: _vm.styles.content, attrs: { "to": _vm.to, "href": _vm.hasUrl ? _vm.url : null }, on: { "click": _vm.onClick } }, "component", attrs, false), [_c("NcAvatar", { staticClass: "user-bubble__avatar", style: _vm.styles.avatar, attrs: { "url": _vm.isCustomAvatar && _vm.isAvatarUrl ? _vm.avatarImage : void 0, "icon-class": _vm.isCustomAvatar && !_vm.isAvatarUrl ? _vm.avatarImage : void 0, "user": _vm.user, "display-name": _vm.displayName, "size": _vm.size - _vm.margin * 2, "disable-tooltip": true, "disable-menu": true, "show-user-status": _vm.showUserStatus } }), _c("span", { staticClass: "user-bubble__name" }, [_vm._v(" " + _vm._s(_vm.displayName || _vm.user) + " ")]), _vm.$slots.name ? _c("span", { staticClass: "user-bubble__secondary" }, [_vm._t("name")], 2) : _vm._e()], 1)];
+  } }], null, true) }, [_vm._t("default")], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  "7942d6b6"
+);
+const NcUserBubble = __component__.exports;
+export {
+  NcUserBubble as N
+};
+//# sourceMappingURL=NcUserBubble-8Mts76ii.mjs.map

package/dist/chunks/NcUserBubble-8Mts76ii.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcUserBubble-8Mts76ii.mjs","sources":["../../src/components/NcUserBubble/NcUserBubbleDiv.vue","../../src/components/NcUserBubble/NcUserBubble.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<template>\n\t<div>\n\t\t<slot name=\"trigger\" />\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcUserBubbleDiv',\n}\n</script>\n","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component displays a user together with a small avatar in a grey bubble.\nIt's possible to use an actual user's avatar, just an image/icon as a url or an icon-class,\nto link the bubble to e.g. a users profile\nand to show a popover on hover with e.g. the full user name handle / email address or something else.\n\nThis component has the following slot:\n* a default slot which is for the content of the popover (this is passed to the popover component directly).\n\n### Examples\n\n```vue\n<p>\n\tSome text before <NcUserBubble user=\"admin\" display-name=\"Admin Example\" url=\"/test\">@admin@foreign-host.com</NcUserBubble> and after the bubble.\n\t<NcUserBubble avatar-image=\"icon-group\" display-name=\"test group xyz\" :primary=\"true\">Hey there!</NcUserBubble>\n</p>\n```\n\n### Example with name slot\n\n```vue\n<template>\n<NcUserBubble\n\t:margin=\"4\"\n\t:size=\"30\"\n\tdisplay-name=\"Administrator\"\n\tuser=\"admin\">\n\t<template #name>\n\t\t<a href=\"#\"\n\t\t\ttitle=\"Remove user\"\n\t\t\tclass=\"icon-close\"\n\t\t\t@click=\"alert\" />\n\t</template>\n</NcUserBubble>\n</template>\n<script>\nexport default {\n\tmethods: {\n\t\talert() {\n\t\t\talert('Removed')\n\t\t},\n\t},\n}\n</script>\n<style>\n.icon-close {\n\tdisplay: block;\n\theight: 100%;\n}\n</style>\n```\n\n</docs>\n\n<template>\n\t<component\n\t\t:is=\"isPopoverComponent\"\n\t\ttrigger=\"hover focus\"\n\t\t:shown=\"open\"\n\t\tclass=\"user-bubble__wrapper\"\n\t\t@update:open=\"onOpenChange\">\n\t\t<!-- Main userbubble structure -->\n\t\t<template #trigger=\"{ attrs }\">\n\t\t\t<component\n\t\t\t\t:is=\"isLinkComponent\"\n\t\t\t\tclass=\"user-bubble__content\"\n\t\t\t\t:style=\"styles.content\"\n\t\t\t\t:to=\"to\"\n\t\t\t\t:href=\"hasUrl ? url : null\"\n\t\t\t\t:class=\"{ 'user-bubble__content--primary': primary }\"\n\t\t\t\tv-bind=\"attrs\"\n\t\t\t\t@click=\"onClick\">\n\t\t\t\t<!-- NcAvatar -->\n\t\t\t\t<NcAvatar\n\t\t\t\t\t:url=\"isCustomAvatar && isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:icon-class=\"isCustomAvatar && !isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:user=\"user\"\n\t\t\t\t\t:display-name=\"displayName\"\n\t\t\t\t\t:size=\"size - (margin * 2)\"\n\t\t\t\t\t:style=\"styles.avatar\"\n\t\t\t\t\t:disable-tooltip=\"true\"\n\t\t\t\t\t:disable-menu=\"true\"\n\t\t\t\t\t:show-user-status=\"showUserStatus\"\n\t\t\t\t\tclass=\"user-bubble__avatar\" />\n\n\t\t\t\t<!-- Name -->\n\t\t\t\t<span class=\"user-bubble__name\">\n\t\t\t\t\t{{ displayName || user }}\n\t\t\t\t</span>\n\n\t\t\t\t<!-- @slot Optional slot just after the name -->\n\t\t\t\t<span v-if=\"$slots.name\" class=\"user-bubble__secondary\">\n\t\t\t\t\t<slot name=\"name\" />\n\t\t\t\t</span>\n\t\t\t</component>\n\t\t</template>\n\n\t\t<!-- @slot Main Popover content on userbubble hover/focus -->\n\t\t<slot />\n\t</component>\n</template>\n\n<script>\nimport Vue from 'vue'\nimport { RouterLink } from 'vue-router'\nimport NcUserBubbleDiv from './NcUserBubbleDiv.vue'\nimport NcAvatar from '../NcAvatar/index.js'\nimport NcPopover from '../NcPopover/index.js'\n\nexport default {\n\tname: 'NcUserBubble',\n\tcomponents: {\n\t\tNcAvatar,\n\t\tNcPopover,\n\t\tNcUserBubbleDiv,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Override generated avatar, can be an url or an icon class\n\t\t */\n\t\tavatarImage: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Provide the user id if this is a user\n\t\t */\n\t\tuser: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Displayed label\n\t\t */\n\t\tdisplayName: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Whether or not to display the user-status\n\t\t */\n\t\tshowUserStatus: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Define the whole bubble as a link\n\t\t */\n\t\turl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t\tvalidator: (url) => {\n\t\t\t\ttry {\n\t\t\t\t\tnew URL(url, url?.startsWith?.('/') ? window.location.href : undefined)\n\t\t\t\t\treturn true\n\t\t\t\t} catch {\n\t\t\t\t\treturn false\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Use bubble as a router-link for in-app navigation\n\t\t */\n\t\tto: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Default popover state. Requires the UserBubble\n\t\t * to have some content to render inside the popover\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Use the primary colour\n\t\t */\n\t\tprimary: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * This is the height of the component\n\t\t */\n\t\tsize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 20,\n\t\t},\n\n\t\t/**\n\t\t * This is the margin of the avatar (size - margin = avatar size)\n\t\t */\n\t\tmargin: {\n\t\t\ttype: Number,\n\t\t\tdefault: 2,\n\t\t},\n\t},\n\n\temits: [\n\t\t'click',\n\t\t'update:open',\n\t],\n\n\tcomputed: {\n\t\t/**\n\t\t * If userbubble is empty, let's NOT\n\t\t * use the Popover component\n\t\t * We need a component instead of a simple div here,\n\t\t * because otherwise the trigger template will not be shown.\n\t\t *\n\t\t * @return {string} 'Popover' or 'UserBubbleDiv'\n\t\t */\n\t\tisPopoverComponent() {\n\t\t\treturn !this.popoverEmpty\n\t\t\t\t? 'NcPopover'\n\t\t\t\t: 'NcUserBubbleDiv'\n\t\t},\n\n\t\t/**\n\t\t * Is the provided avatar url valid or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisAvatarUrl() {\n\t\t\tif (!this.avatarImage) {\n\t\t\t\treturn false\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tconst url = new URL(this.avatarImage)\n\t\t\t\treturn !!url\n\t\t\t} catch {\n\t\t\t\treturn false\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Do we have a custom avatar or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisCustomAvatar() {\n\t\t\treturn !!this.avatarImage\n\t\t},\n\n\t\thasUrl() {\n\t\t\treturn this.url && this.url.trim() !== ''\n\t\t},\n\n\t\tisLinkComponent() {\n\t\t\tif (this.hasUrl) {\n\t\t\t\treturn 'a'\n\t\t\t} else if (this.to) {\n\t\t\t\treturn RouterLink\n\t\t\t} else {\n\t\t\t\treturn 'div'\n\t\t\t}\n\t\t},\n\n\t\tpopoverEmpty() {\n\t\t\tif ('default' in this.$slots) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\treturn true\n\t\t},\n\n\t\tstyles() {\n\t\t\treturn {\n\t\t\t\tcontent: {\n\t\t\t\t\theight: this.size + 'px',\n\t\t\t\t\tlineHeight: this.size + 'px',\n\t\t\t\t\tborderRadius: this.size / 2 + 'px',\n\t\t\t\t},\n\n\t\t\t\tavatar: {\n\t\t\t\t\tmarginInlineStart: this.margin + 'px',\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmounted() {\n\t\tif (!this.displayName && !this.user) {\n\t\t\tVue.util.warn('[NcUserBubble] At least `displayName` or `user` property should be set.')\n\t\t}\n\t},\n\n\tmethods: {\n\t\tonOpenChange(state) {\n\t\t\tthis.$emit('update:open', state)\n\t\t},\n\n\t\t/**\n\t\t * Catch and forward click event to parent\n\t\t *\n\t\t * @param {Event} event the click event\n\t\t */\n\t\tonClick(event) {\n\t\t\tthis.$emit('click', event)\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.user-bubble {\n\t&__wrapper {\n\t\t// align inline with text\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t\t// shrink and allow grow to fit\n\t\tmin-width: 0;\n\t\tmax-width: 100%;\n\t}\n\n\t&__content {\n\t\tdisplay: inline-flex;\n\t\tmax-width: 100%;\n\t\tbackground-color: var(--color-background-dark);\n\n\t\t&--primary {\n\t\t\tcolor: var(--color-primary-element-text);\n\t\t\tbackground-color: var(--color-primary-element);\n\t\t}\n\n\t\t> :last-child {\n\t\t\t// border radius end padding\n\t\t\tpadding-inline-end: 8px;\n\t\t}\n\t}\n\n\t&__avatar {\n\t\talign-self: center;\n\t}\n\n\t&__name {\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n\n\t&__name,\n\t&__secondary {\n\t\t// proper spacing between avatar, name & slot\n\t\tpadding-block: 0;\n\t\tpadding-inline: 4px 0;\n\t}\n}\n</style>\n"],"names":["_sfc_main"],"mappings":"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"}

package/dist/chunks/NcUserBubble-Bb9WBP1S.cjs

@@ -0,0 +1,223 @@
+require('../assets/NcUserBubble-uIpJvFoQ.css');
+"use strict";
+const Vue = require("vue");
+const vueRouter = require("vue-router");
+const _pluginVue2_normalizer = require("./_plugin-vue2_normalizer-V0q-tHlQ.cjs");
+const NcAvatar = require("./NcAvatar-D_0Aw88L.cjs");
+const NcPopover = require("./NcPopover-DrXnNOgM.cjs");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const Vue__default = /* @__PURE__ */ _interopDefault(Vue);
+const _sfc_main$1 = {
+  name: "NcUserBubbleDiv"
+};
+var _sfc_render$1 = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", [_vm._t("trigger")], 2);
+};
+var _sfc_staticRenderFns$1 = [];
+var __component__$1 = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
+  _sfc_main$1,
+  _sfc_render$1,
+  _sfc_staticRenderFns$1,
+  false,
+  null,
+  null
+);
+const NcUserBubbleDiv = __component__$1.exports;
+const _sfc_main = {
+  name: "NcUserBubble",
+  components: {
+    NcAvatar: NcAvatar.NcAvatar,
+    NcPopover: NcPopover.NcPopover,
+    NcUserBubbleDiv
+  },
+  props: {
+    /**
+     * Override generated avatar, can be an url or an icon class
+     */
+    avatarImage: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Provide the user id if this is a user
+     */
+    user: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Displayed label
+     */
+    displayName: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Whether or not to display the user-status
+     */
+    showUserStatus: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Define the whole bubble as a link
+     */
+    url: {
+      type: String,
+      default: void 0,
+      validator: (url) => {
+        var _a;
+        try {
+          new URL(url, ((_a = url == null ? void 0 : url.startsWith) == null ? void 0 : _a.call(url, "/")) ? window.location.href : void 0);
+          return true;
+        } catch (e) {
+          return false;
+        }
+      }
+    },
+    /**
+     * Use bubble as a router-link for in-app navigation
+     */
+    to: {
+      type: [String, Object],
+      default: void 0
+    },
+    /**
+     * Default popover state. Requires the UserBubble
+     * to have some content to render inside the popover
+     */
+    open: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Use the primary colour
+     */
+    primary: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * This is the height of the component
+     */
+    size: {
+      type: Number,
+      default: 20
+    },
+    /**
+     * This is the margin of the avatar (size - margin = avatar size)
+     */
+    margin: {
+      type: Number,
+      default: 2
+    }
+  },
+  emits: [
+    "click",
+    "update:open"
+  ],
+  computed: {
+    /**
+     * If userbubble is empty, let's NOT
+     * use the Popover component
+     * We need a component instead of a simple div here,
+     * because otherwise the trigger template will not be shown.
+     *
+     * @return {string} 'Popover' or 'UserBubbleDiv'
+     */
+    isPopoverComponent() {
+      return !this.popoverEmpty ? "NcPopover" : "NcUserBubbleDiv";
+    },
+    /**
+     * Is the provided avatar url valid or not
+     *
+     * @return {boolean}
+     */
+    isAvatarUrl() {
+      if (!this.avatarImage) {
+        return false;
+      }
+      try {
+        const url = new URL(this.avatarImage);
+        return !!url;
+      } catch (e) {
+        return false;
+      }
+    },
+    /**
+     * Do we have a custom avatar or not
+     *
+     * @return {boolean}
+     */
+    isCustomAvatar() {
+      return !!this.avatarImage;
+    },
+    hasUrl() {
+      return this.url && this.url.trim() !== "";
+    },
+    isLinkComponent() {
+      if (this.hasUrl) {
+        return "a";
+      } else if (this.to) {
+        return vueRouter.RouterLink;
+      } else {
+        return "div";
+      }
+    },
+    popoverEmpty() {
+      if ("default" in this.$slots) {
+        return false;
+      }
+      return true;
+    },
+    styles() {
+      return {
+        content: {
+          height: this.size + "px",
+          lineHeight: this.size + "px",
+          borderRadius: this.size / 2 + "px"
+        },
+        avatar: {
+          marginInlineStart: this.margin + "px"
+        }
+      };
+    }
+  },
+  mounted() {
+    if (!this.displayName && !this.user) {
+      Vue__default.default.util.warn("[NcUserBubble] At least `displayName` or `user` property should be set.");
+    }
+  },
+  methods: {
+    onOpenChange(state) {
+      this.$emit("update:open", state);
+    },
+    /**
+     * Catch and forward click event to parent
+     *
+     * @param {Event} event the click event
+     */
+    onClick(event) {
+      this.$emit("click", event);
+    }
+  }
+};
+var _sfc_render = function render2() {
+  var _vm = this, _c = _vm._self._c;
+  return _c(_vm.isPopoverComponent, { tag: "component", staticClass: "user-bubble__wrapper", attrs: { "trigger": "hover focus", "shown": _vm.open }, on: { "update:open": _vm.onOpenChange }, scopedSlots: _vm._u([{ key: "trigger", fn: function({ attrs }) {
+    return [_c(_vm.isLinkComponent, _vm._b({ tag: "component", staticClass: "user-bubble__content", class: { "user-bubble__content--primary": _vm.primary }, style: _vm.styles.content, attrs: { "to": _vm.to, "href": _vm.hasUrl ? _vm.url : null }, on: { "click": _vm.onClick } }, "component", attrs, false), [_c("NcAvatar", { staticClass: "user-bubble__avatar", style: _vm.styles.avatar, attrs: { "url": _vm.isCustomAvatar && _vm.isAvatarUrl ? _vm.avatarImage : void 0, "icon-class": _vm.isCustomAvatar && !_vm.isAvatarUrl ? _vm.avatarImage : void 0, "user": _vm.user, "display-name": _vm.displayName, "size": _vm.size - _vm.margin * 2, "disable-tooltip": true, "disable-menu": true, "show-user-status": _vm.showUserStatus } }), _c("span", { staticClass: "user-bubble__name" }, [_vm._v(" " + _vm._s(_vm.displayName || _vm.user) + " ")]), _vm.$slots.name ? _c("span", { staticClass: "user-bubble__secondary" }, [_vm._t("name")], 2) : _vm._e()], 1)];
+  } }], null, true) }, [_vm._t("default")], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  "7942d6b6"
+);
+const NcUserBubble = __component__.exports;
+exports.NcUserBubble = NcUserBubble;
+//# sourceMappingURL=NcUserBubble-Bb9WBP1S.cjs.map

package/dist/chunks/NcUserBubble-Bb9WBP1S.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NcUserBubble-Bb9WBP1S.cjs","sources":["../../src/components/NcUserBubble/NcUserBubbleDiv.vue","../../src/components/NcUserBubble/NcUserBubble.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<template>\n\t<div>\n\t\t<slot name=\"trigger\" />\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcUserBubbleDiv',\n}\n</script>\n","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component displays a user together with a small avatar in a grey bubble.\nIt's possible to use an actual user's avatar, just an image/icon as a url or an icon-class,\nto link the bubble to e.g. a users profile\nand to show a popover on hover with e.g. the full user name handle / email address or something else.\n\nThis component has the following slot:\n* a default slot which is for the content of the popover (this is passed to the popover component directly).\n\n### Examples\n\n```vue\n<p>\n\tSome text before <NcUserBubble user=\"admin\" display-name=\"Admin Example\" url=\"/test\">@admin@foreign-host.com</NcUserBubble> and after the bubble.\n\t<NcUserBubble avatar-image=\"icon-group\" display-name=\"test group xyz\" :primary=\"true\">Hey there!</NcUserBubble>\n</p>\n```\n\n### Example with name slot\n\n```vue\n<template>\n<NcUserBubble\n\t:margin=\"4\"\n\t:size=\"30\"\n\tdisplay-name=\"Administrator\"\n\tuser=\"admin\">\n\t<template #name>\n\t\t<a href=\"#\"\n\t\t\ttitle=\"Remove user\"\n\t\t\tclass=\"icon-close\"\n\t\t\t@click=\"alert\" />\n\t</template>\n</NcUserBubble>\n</template>\n<script>\nexport default {\n\tmethods: {\n\t\talert() {\n\t\t\talert('Removed')\n\t\t},\n\t},\n}\n</script>\n<style>\n.icon-close {\n\tdisplay: block;\n\theight: 100%;\n}\n</style>\n```\n\n</docs>\n\n<template>\n\t<component\n\t\t:is=\"isPopoverComponent\"\n\t\ttrigger=\"hover focus\"\n\t\t:shown=\"open\"\n\t\tclass=\"user-bubble__wrapper\"\n\t\t@update:open=\"onOpenChange\">\n\t\t<!-- Main userbubble structure -->\n\t\t<template #trigger=\"{ attrs }\">\n\t\t\t<component\n\t\t\t\t:is=\"isLinkComponent\"\n\t\t\t\tclass=\"user-bubble__content\"\n\t\t\t\t:style=\"styles.content\"\n\t\t\t\t:to=\"to\"\n\t\t\t\t:href=\"hasUrl ? url : null\"\n\t\t\t\t:class=\"{ 'user-bubble__content--primary': primary }\"\n\t\t\t\tv-bind=\"attrs\"\n\t\t\t\t@click=\"onClick\">\n\t\t\t\t<!-- NcAvatar -->\n\t\t\t\t<NcAvatar\n\t\t\t\t\t:url=\"isCustomAvatar && isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:icon-class=\"isCustomAvatar && !isAvatarUrl ? avatarImage : undefined\"\n\t\t\t\t\t:user=\"user\"\n\t\t\t\t\t:display-name=\"displayName\"\n\t\t\t\t\t:size=\"size - (margin * 2)\"\n\t\t\t\t\t:style=\"styles.avatar\"\n\t\t\t\t\t:disable-tooltip=\"true\"\n\t\t\t\t\t:disable-menu=\"true\"\n\t\t\t\t\t:show-user-status=\"showUserStatus\"\n\t\t\t\t\tclass=\"user-bubble__avatar\" />\n\n\t\t\t\t<!-- Name -->\n\t\t\t\t<span class=\"user-bubble__name\">\n\t\t\t\t\t{{ displayName || user }}\n\t\t\t\t</span>\n\n\t\t\t\t<!-- @slot Optional slot just after the name -->\n\t\t\t\t<span v-if=\"$slots.name\" class=\"user-bubble__secondary\">\n\t\t\t\t\t<slot name=\"name\" />\n\t\t\t\t</span>\n\t\t\t</component>\n\t\t</template>\n\n\t\t<!-- @slot Main Popover content on userbubble hover/focus -->\n\t\t<slot />\n\t</component>\n</template>\n\n<script>\nimport Vue from 'vue'\nimport { RouterLink } from 'vue-router'\nimport NcUserBubbleDiv from './NcUserBubbleDiv.vue'\nimport NcAvatar from '../NcAvatar/index.js'\nimport NcPopover from '../NcPopover/index.js'\n\nexport default {\n\tname: 'NcUserBubble',\n\tcomponents: {\n\t\tNcAvatar,\n\t\tNcPopover,\n\t\tNcUserBubbleDiv,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Override generated avatar, can be an url or an icon class\n\t\t */\n\t\tavatarImage: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Provide the user id if this is a user\n\t\t */\n\t\tuser: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Displayed label\n\t\t */\n\t\tdisplayName: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Whether or not to display the user-status\n\t\t */\n\t\tshowUserStatus: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Define the whole bubble as a link\n\t\t */\n\t\turl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t\tvalidator: (url) => {\n\t\t\t\ttry {\n\t\t\t\t\tnew URL(url, url?.startsWith?.('/') ? window.location.href : undefined)\n\t\t\t\t\treturn true\n\t\t\t\t} catch {\n\t\t\t\t\treturn false\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Use bubble as a router-link for in-app navigation\n\t\t */\n\t\tto: {\n\t\t\ttype: [String, Object],\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * Default popover state. Requires the UserBubble\n\t\t * to have some content to render inside the popover\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Use the primary colour\n\t\t */\n\t\tprimary: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * This is the height of the component\n\t\t */\n\t\tsize: {\n\t\t\ttype: Number,\n\t\t\tdefault: 20,\n\t\t},\n\n\t\t/**\n\t\t * This is the margin of the avatar (size - margin = avatar size)\n\t\t */\n\t\tmargin: {\n\t\t\ttype: Number,\n\t\t\tdefault: 2,\n\t\t},\n\t},\n\n\temits: [\n\t\t'click',\n\t\t'update:open',\n\t],\n\n\tcomputed: {\n\t\t/**\n\t\t * If userbubble is empty, let's NOT\n\t\t * use the Popover component\n\t\t * We need a component instead of a simple div here,\n\t\t * because otherwise the trigger template will not be shown.\n\t\t *\n\t\t * @return {string} 'Popover' or 'UserBubbleDiv'\n\t\t */\n\t\tisPopoverComponent() {\n\t\t\treturn !this.popoverEmpty\n\t\t\t\t? 'NcPopover'\n\t\t\t\t: 'NcUserBubbleDiv'\n\t\t},\n\n\t\t/**\n\t\t * Is the provided avatar url valid or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisAvatarUrl() {\n\t\t\tif (!this.avatarImage) {\n\t\t\t\treturn false\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tconst url = new URL(this.avatarImage)\n\t\t\t\treturn !!url\n\t\t\t} catch {\n\t\t\t\treturn false\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Do we have a custom avatar or not\n\t\t *\n\t\t * @return {boolean}\n\t\t */\n\t\tisCustomAvatar() {\n\t\t\treturn !!this.avatarImage\n\t\t},\n\n\t\thasUrl() {\n\t\t\treturn this.url && this.url.trim() !== ''\n\t\t},\n\n\t\tisLinkComponent() {\n\t\t\tif (this.hasUrl) {\n\t\t\t\treturn 'a'\n\t\t\t} else if (this.to) {\n\t\t\t\treturn RouterLink\n\t\t\t} else {\n\t\t\t\treturn 'div'\n\t\t\t}\n\t\t},\n\n\t\tpopoverEmpty() {\n\t\t\tif ('default' in this.$slots) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\treturn true\n\t\t},\n\n\t\tstyles() {\n\t\t\treturn {\n\t\t\t\tcontent: {\n\t\t\t\t\theight: this.size + 'px',\n\t\t\t\t\tlineHeight: this.size + 'px',\n\t\t\t\t\tborderRadius: this.size / 2 + 'px',\n\t\t\t\t},\n\n\t\t\t\tavatar: {\n\t\t\t\t\tmarginInlineStart: this.margin + 'px',\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmounted() {\n\t\tif (!this.displayName && !this.user) {\n\t\t\tVue.util.warn('[NcUserBubble] At least `displayName` or `user` property should be set.')\n\t\t}\n\t},\n\n\tmethods: {\n\t\tonOpenChange(state) {\n\t\t\tthis.$emit('update:open', state)\n\t\t},\n\n\t\t/**\n\t\t * Catch and forward click event to parent\n\t\t *\n\t\t * @param {Event} event the click event\n\t\t */\n\t\tonClick(event) {\n\t\t\tthis.$emit('click', event)\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.user-bubble {\n\t&__wrapper {\n\t\t// align inline with text\n\t\tdisplay: inline-block;\n\t\tvertical-align: middle;\n\t\t// shrink and allow grow to fit\n\t\tmin-width: 0;\n\t\tmax-width: 100%;\n\t}\n\n\t&__content {\n\t\tdisplay: inline-flex;\n\t\tmax-width: 100%;\n\t\tbackground-color: var(--color-background-dark);\n\n\t\t&--primary {\n\t\t\tcolor: var(--color-primary-element-text);\n\t\t\tbackground-color: var(--color-primary-element);\n\t\t}\n\n\t\t> :last-child {\n\t\t\t// border radius end padding\n\t\t\tpadding-inline-end: 8px;\n\t\t}\n\t}\n\n\t&__avatar {\n\t\talign-self: center;\n\t}\n\n\t&__name {\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n\n\t&__name,\n\t&__secondary {\n\t\t// proper spacing between avatar, name & slot\n\t\tpadding-block: 0;\n\t\tpadding-inline: 4px 0;\n\t}\n}\n</style>\n"],"names":["_sfc_main","NcAvatar","NcPopover","RouterLink","Vue"],"mappings":"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"}

package/dist/chunks/NcUserStatusIcon-BWxo_etm.mjs

@@ -0,0 +1,147 @@
+import '../assets/NcUserStatusIcon-Bw8yMFMP.css';
+import axios from "@nextcloud/axios";
+import { getCapabilities } from "@nextcloud/capabilities";
+import { generateOcsUrl } from "@nextcloud/router";
+import { r as register, R as t51, S as t11, a as t } from "./_l10n-DSLCwJSN.mjs";
+import { i as isLegacy32 } from "./legacy-NU_qxPFK.mjs";
+import { n as normalizeComponent } from "./_plugin-vue2_normalizer-DU4iP6Vu.mjs";
+const awayLegacySvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="-1 -1 18 18" width="16" height="16" xmlns="http://www.w3.org/2000/svg">\n	<path fill="none" d="M-4-4h24v24H-4z" />\n	<path fill="var(--color-warning)" d="M6.9.1C3 .6-.1 4-.1 8c0 4.4 3.6 8 8 8 4 0 7.4-3 8-6.9-1.2 1.3-2.9 2.1-4.7 2.1-3.5 0-6.4-2.9-6.4-6.4 0-1.9.8-3.6 2.1-4.7z" />\n</svg>\n';
+const awaySvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="0 -960 960 960" width="24px" height="24px" xmlns="http://www.w3.org/2000/svg">\n	<path\n		fill="var(--user-status-color-away, var(--color-warning, #C88800))"\n		d="m612-292 56-56-148-148v-184h-80v216l172 172ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"/>\n</svg>\n';
+const busySvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="0 -960 960 960" width="24px" height="24px" xmlns="http://www.w3.org/2000/svg">\n	<path\n		fill="var(--user-status-color-busy, var(--color-error, #DB0606))"\n		d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"/>\n</svg>\n';
+const dndLegacySvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="-1 -1 18 18" width="16" height="16" xmlns="http://www.w3.org/2000/svg">\n	<path fill="none" d="M-4-4h24v24H-4V-4z" />\n	<path fill="var(--color-border-error, var(--color-error))" d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8z" />\n	<path fill="#fdffff" d="M5 6.5h6c.8 0 1.5.7 1.5 1.5s-.7 1.5-1.5 1.5H5c-.8 0-1.5-.7-1.5-1.5S4.2 6.5 5 6.5z" />\n</svg>\n';
+const dndSvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="0 -960 960 960" width="24px" height="24px" xmlns="http://www.w3.org/2000/svg">\n	<path\n		fill="var(--user-status-color-busy, var(--color-error, #DB0606))"\n		d="M280-440h400v-80H280v80ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"/>\n</svg>\n';
+const invisibleLegacySvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="-1 -1 18 18" width="16" height="16" xmlns="http://www.w3.org/2000/svg">\n	<path fill="none" d="M-4-4h24v24H-4V-4z" />\n	<path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 3.2c2.7 0 4.8 2.1 4.8 4.8s-2.1 4.8-4.8 4.8S3.2 10.7 3.2 8 5.3 3.2 8 3.2z" />\n</svg>\n';
+const invisibleSvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="0 -960 960 960" width="24px" height="24px" xmlns="http://www.w3.org/2000/svg">\n	<path\n		fill="var(--user-status-color-offline, var(--color-text-maxcontrast, #6B6B6B))"\n		d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z"/>\n</svg>\n';
+const onlineLegacySvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="-1 -1 18 18" width="16" height="16" xmlns="http://www.w3.org/2000/svg">\n	<path fill="var(--color-success)" d="M4.8 11.2h6.4V4.8H4.8v6.4zM8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8z" />\n</svg>\n';
+const onlineSvg = '<!--\n  - SPDX-FileCopyrightText: 2020 Google Inc.\n  - SPDX-License-Identifier: Apache-2.0\n-->\n<svg viewBox="0 -960 960 960" width="24px" height="24px" xmlns="http://www.w3.org/2000/svg">\n	<path\n		fill="var(--user-status-color-online, var(--color-success, #2D7B41))"\n		d="m424-296 282-282-56-56-226 226-114-114-56 56 170 170Zm56 216q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"/>\n</svg>\n';
+register(t51);
+register(t11);
+function getUserStatusText(status) {
+  switch (status) {
+    case "away":
+      return t("away");
+    // TRANSLATORS: User status if the user is currently away from keyboard
+    case "busy":
+      return t("busy");
+    case "dnd":
+      return t("do not disturb");
+    case "online":
+      return t("online");
+    case "invisible":
+      return t("invisible");
+    case "offline":
+      return t("offline");
+    default:
+      return status;
+  }
+}
+const matchSvg = {
+  online: isLegacy32 ? onlineLegacySvg : onlineSvg,
+  away: isLegacy32 ? awayLegacySvg : awaySvg,
+  busy: isLegacy32 ? awayLegacySvg : busySvg,
+  dnd: isLegacy32 ? dndLegacySvg : dndSvg,
+  invisible: isLegacy32 ? invisibleLegacySvg : invisibleSvg,
+  offline: isLegacy32 ? invisibleLegacySvg : invisibleSvg
+};
+const _sfc_main = {
+  name: "NcUserStatusIcon",
+  props: {
+    /**
+     * Set the user id to fetch the status
+     */
+    user: {
+      type: String,
+      default: null
+    },
+    /**
+     * Set the status
+     *
+     * @type {'online' | 'away' | 'busy' | 'dnd' | 'invisible' | 'offline'}
+     */
+    status: {
+      type: String,
+      default: null,
+      validator: (value) => [
+        "online",
+        "away",
+        "busy",
+        "dnd",
+        "invisible",
+        "offline"
+      ].includes(value)
+    },
+    /**
+     * Set the `aria-hidden` attribute
+     *
+     * @type {'true' | 'false'}
+     */
+    ariaHidden: {
+      type: String,
+      default: null,
+      validator: (value) => [
+        "true",
+        "false"
+      ].includes(value)
+    }
+  },
+  data() {
+    return {
+      fetchedUserStatus: null
+    };
+  },
+  computed: {
+    activeStatus() {
+      var _a;
+      return (_a = this.status) != null ? _a : this.fetchedUserStatus;
+    },
+    activeSvg() {
+      var _a;
+      return (_a = matchSvg[this.activeStatus]) != null ? _a : null;
+    },
+    ariaLabel() {
+      if (this.ariaHidden === "true") {
+        return null;
+      }
+      return t("User status: {status}", { status: getUserStatusText(this.activeStatus) });
+    }
+  },
+  watch: {
+    user: {
+      immediate: true,
+      async handler(user) {
+        var _a, _b, _c, _d;
+        if (!user || !((_b = (_a = getCapabilities()) == null ? void 0 : _a.user_status) == null ? void 0 : _b.enabled)) {
+          this.fetchedUserStatus = null;
+          return;
+        }
+        try {
+          const { data } = await axios.get(generateOcsUrl("/apps/user_status/api/v1/statuses/{user}", { user }));
+          this.fetchedUserStatus = (_d = (_c = data.ocs) == null ? void 0 : _c.data) == null ? void 0 : _d.status;
+        } catch (e) {
+          this.fetchedUserStatus = null;
+        }
+      }
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _vm.activeStatus ? _c("span", { staticClass: "user-status-icon", class: {
+    "user-status-icon--invisible": ["invisible", "offline"].includes(_vm.status)
+  }, attrs: { "role": "img", "aria-hidden": _vm.ariaHidden, "aria-label": _vm.ariaLabel }, domProps: { "innerHTML": _vm._s(_vm.activeSvg) } }) : _vm._e();
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  "86b73d39"
+);
+const NcUserStatusIcon = __component__.exports;
+export {
+  NcUserStatusIcon as N,
+  getUserStatusText as g
+};
+//# sourceMappingURL=NcUserStatusIcon-BWxo_etm.mjs.map