@nextcloud/vue/dist/chunks/NcDashboardWidgetItem-C_xl9X2u.mjs

Nextcloud vue components

import '../assets/NcDashboardWidgetItem-DPVZ3Oso.css';
import { N as NcActionButton } from "./NcActionButton-pKOSrlGE.mjs";
import { N as NcActions } from "./NcActions-DWmvh7-Y.mjs";
import { N as NcAvatar } from "./NcAvatar-DmUGApWA.mjs";
import { resolveComponent, createElementBlock, openBlock, createBlock, resolveDynamicComponent, normalizeClass, withCtx, renderSlot, createCommentVNode, createElementVNode, createVNode, toDisplayString, Fragment, renderList, withModifiers, createTextVNode } from "vue";
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
const _sfc_main = {
  name: "NcDashboardWidgetItem",
  components: {
    NcAvatar,
    NcActions,
    NcActionButton
  },
  props: {
    /**
     * The item id (optional)
     */
    id: {
      type: [String, Number],
      default: void 0
    },
    /**
     * The item element is a link to this URL (optional)
     */
    targetUrl: {
      type: String,
      default: void 0
    },
    /**
     * Where to get the avatar image. (optional) Used if avatarUsername is not defined.
     */
    avatarUrl: {
      type: String,
      default: void 0
    },
    /**
     * Name to provide to the Avatar. (optional) Used if avatarUrl is not defined.
     */
    avatarUsername: {
      type: String,
      default: void 0
    },
    /**
     * Is the avatarUsername not a user's name? (optional, false by default)
     */
    avatarIsNoUser: {
      type: Boolean,
      default: false
    },
    /**
     * Small icon to display on the bottom-right corner of the avatar (optional)
     */
    overlayIconUrl: {
      type: String,
      default: void 0
    },
    /**
     * Item main text (mandatory)
     */
    mainText: {
      type: String,
      required: true
    },
    /**
     * Item subline text (optional)
     */
    subText: {
      type: String,
      default: ""
    },
    /**
     * An object containing context menu entries that will be displayed for each items (optional)
     */
    itemMenu: {
      type: Object,
      default: () => {
        return {};
      }
    },
    /**
     * Specify whether the 3 dot menu is forced when only one action is present
     */
    forceMenu: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      hovered: false
    };
  },
  computed: {
    item() {
      return {
        id: this.id,
        targetUrl: this.targetUrl,
        avatarUrl: this.avatarUrl,
        avatarUsername: this.avatarUsername,
        overlayIconUrl: this.overlayIconUrl,
        mainText: this.mainText,
        subText: this.subText
      };
    },
    gotMenu() {
      return Object.keys(this.itemMenu).length !== 0 || !!this.$slots.actions;
    },
    gotOverlayIcon() {
      return this.overlayIconUrl && this.overlayIconUrl !== "";
    }
  },
  methods: {
    onLinkClick(event) {
      if (event.target.closest(".action-item")) {
        event.preventDefault();
      }
    }
  }
};
const _hoisted_1 = ["src"];
const _hoisted_2 = { class: "item__details" };
const _hoisted_3 = ["title"];
const _hoisted_4 = ["title"];
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_NcAvatar = resolveComponent("NcAvatar");
  const _component_NcActionButton = resolveComponent("NcActionButton");
  const _component_NcActions = resolveComponent("NcActions");
  return openBlock(), createElementBlock("div", {
    onMouseover: _cache[0] || (_cache[0] = ($event) => $data.hovered = true),
    onMouseleave: _cache[1] || (_cache[1] = ($event) => $data.hovered = false)
  }, [
    (openBlock(), createBlock(resolveDynamicComponent($props.targetUrl ? "a" : "div"), {
      href: $props.targetUrl || void 0,
      target: $props.targetUrl ? "_blank" : void 0,
      class: normalizeClass(["item-list__entry", { "item-list__entry--has-actions-menu": $options.gotMenu }]),
      onClick: $options.onLinkClick
    }, {
      default: withCtx(() => [
        renderSlot(_ctx.$slots, "avatar", {
          avatarUrl: $props.avatarUrl,
          avatarUsername: $props.avatarUsername
        }, () => [
          createVNode(_component_NcAvatar, {
            class: "item-avatar",
            size: 44,
            url: $props.avatarUrl,
            user: $props.avatarUsername,
            "is-no-user": $props.avatarIsNoUser,
            "hide-status": $options.gotOverlayIcon
          }, null, 8, ["url", "user", "is-no-user", "hide-status"])
        ], true),
        $props.overlayIconUrl ? (openBlock(), createElementBlock("img", {
          key: 0,
          class: "item-icon",
          alt: "",
          src: $props.overlayIconUrl
        }, null, 8, _hoisted_1)) : createCommentVNode("", true),
        createElementVNode("div", _hoisted_2, [
          createElementVNode("h3", { title: $props.mainText }, toDisplayString($props.mainText), 9, _hoisted_3),
          $props.subText !== "" ? (openBlock(), createElementBlock("span", {
            key: 0,
            class: "message",
            title: $props.subText
          }, toDisplayString($props.subText), 9, _hoisted_4)) : createCommentVNode("", true)
        ]),
        $options.gotMenu ? (openBlock(), createBlock(_component_NcActions, {
          key: 1,
          "force-menu": $props.forceMenu
        }, {
          default: withCtx(() => [
            renderSlot(_ctx.$slots, "actions", {}, () => [
              (openBlock(true), createElementBlock(Fragment, null, renderList($props.itemMenu, (m, menuItemId) => {
                return openBlock(), createBlock(_component_NcActionButton, {
                  key: menuItemId,
                  icon: m.icon,
                  "close-after-click": true,
                  onClick: withModifiers(($event) => _ctx.$emit(menuItemId, $options.item), ["prevent", "stop"])
                }, {
                  default: withCtx(() => [
                    createTextVNode(toDisplayString(m.text), 1)
                  ]),
                  _: 2
                }, 1032, ["icon", "onClick"]);
              }), 128))
            ], true)
          ]),
          _: 3
        }, 8, ["force-menu"])) : createCommentVNode("", true)
      ]),
      _: 3
    }, 8, ["href", "target", "class", "onClick"]))
  ], 32);
}
const NcDashboardWidgetItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-c033ba26"]]);
export {
  NcDashboardWidgetItem as N
};
//# sourceMappingURL=NcDashboardWidgetItem-C_xl9X2u.mjs.map