@nextcloud/vue/dist/Components/NcListItem.mjs

Nextcloud vue components

import "../assets/index9.css";
import o from "./NcActions.mjs";
import l from "./NcCounterBubble.mjs";
import c from "./NcVNodes.mjs";
import { t as r } from "../chunks/l10n-9a5a6afc.mjs";
import { n as u } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
const d = { name: "NcListItem", components: { NcActions: o, NcCounterBubble: l, NcVNodes: c }, props: { details: { type: String, default: "" }, name: { type: String, required: !0 }, exact: { type: Boolean, default: !1 }, to: { type: [String, Object], default: null }, href: { type: String, default: "#" }, anchorId: { type: String, default: "" }, bold: { type: Boolean, default: !1 }, compact: { type: Boolean, default: !1 }, active: { type: Boolean, default: !1 }, linkAriaLabel: { type: String, default: "" }, actionsAriaLabel: { type: String, default: "" }, counterNumber: { type: [Number, String], default: 0 }, counterType: { type: String, default: "", validator(t) {
  return ["highlighted", "outlined", ""].indexOf(t) !== -1;
} }, forceDisplayActions: { type: Boolean, default: !1 } }, emits: ["click", "update:menuOpen"], data() {
  return { hovered: !1, focused: !1, hasActions: !1, hasSubname: !1, displayActionsOnHoverFocus: !1, menuOpen: !1, hasIndicator: !1 };
}, computed: { hasDetails() {
  return this.details !== "";
}, oneLine() {
  return !this.hasSubname && !this.showDetails;
}, showAdditionalElements() {
  return !this.displayActionsOnHoverFocus || this.forceDisplayActions;
}, showDetails() {
  return this.hasDetails && (!this.displayActionsOnHoverFocus || this.forceDisplayActions);
}, computedActionsAriaLabel() {
  return this.actionsAriaLabel || r('Actions for item with name "{name}"', { name: this.name });
} }, watch: { menuOpen(t) {
  !t && !this.hovered && (this.displayActionsOnHoverFocus = !1);
} }, mounted() {
  this.checkSlots();
}, updated() {
  this.checkSlots();
}, methods: { onClick(t, e, i) {
  this.$emit("click", t), !(t.metaKey || t.altKey || t.ctrlKey || t.shiftKey) && i && (e == null || e(t), t.preventDefault());
}, handleMouseover() {
  this.showActions(), this.hovered = !0;
}, showActions() {
  this.hasActions && (this.displayActionsOnHoverFocus = !0), this.hovered = !1;
}, hideActions() {
  this.displayActionsOnHoverFocus = !1;
}, handleFocus() {
  this.focused = !0, this.showActions();
}, handleBlur() {
  this.focused = !1;
}, handleMouseleave() {
  this.menuOpen || (this.displayActionsOnHoverFocus = !1), this.hovered = !1;
}, handleTab(t) {
  this.focused && this.hasActions ? (t.preventDefault(), this.$refs.actions.$refs.menuButton.$el.focus(), this.focused = !1) : this.displayActionsOnHoverFocus = !1;
}, handleActionsUpdateOpen(t) {
  this.menuOpen = t, this.$emit("update:menuOpen", t);
}, checkSlots() {
  this.hasActions !== !!this.$slots.actions && (this.hasActions = !!this.$slots.actions), this.hasSubname !== !!this.$slots.subname && (this.hasSubname = !!this.$slots.subname), this.hasIndicator !== !!this.$slots.indicator && (this.hasIndicator = !!this.$slots.indicator);
} } };
var h = function() {
  var t = this, e = t._self._c;
  return e(t.to ? "router-link" : "NcVNodes", { tag: "component", attrs: { custom: t.to ? !0 : null, to: t.to, exact: t.to ? t.exact : null }, scopedSlots: t._u([{ key: "default", fn: function({ href: i, navigate: a, isActive: n }) {
    return [e("li", { staticClass: "list-item__wrapper", class: { "list-item__wrapper--active": n || t.active } }, [e("a", { ref: "list-item", staticClass: "list-item", attrs: { id: t.anchorId, href: i || t.href, target: t.href === "#" ? void 0 : "_blank", rel: t.href === "#" ? void 0 : "noopener noreferrer", "aria-label": t.linkAriaLabel }, on: { mouseover: t.handleMouseover, mouseleave: t.handleMouseleave, focus: t.handleFocus, blur: t.handleBlur, keydown: [function(s) {
      return !s.type.indexOf("key") && t._k(s.keyCode, "tab", 9, s.key, "Tab") || s.ctrlKey || s.shiftKey || s.altKey || s.metaKey ? null : t.handleTab.apply(null, arguments);
    }, function(s) {
      return !s.type.indexOf("key") && t._k(s.keyCode, "esc", 27, s.key, ["Esc", "Escape"]) ? null : t.hideActions.apply(null, arguments);
    }], click: function(s) {
      return t.onClick(s, a, i);
    } } }, [e("div", { staticClass: "list-item-content__wrapper", class: { "list-item-content__wrapper--compact": t.compact } }, [t._t("icon"), e("div", { staticClass: "list-item-content" }, [e("div", { staticClass: "list-item-content__main", class: { "list-item-content__main--oneline": t.oneLine } }, [e("div", { staticClass: "line-one" }, [e("span", { staticClass: "line-one__name" }, [t._v(" " + t._s(t.name) + " ")]), t.showDetails ? e("span", { staticClass: "line-one__details" }, [t._v(" " + t._s(t.details) + " ")]) : t._e()]), e("div", { staticClass: "line-two", class: { "line-two--bold": t.bold } }, [t.hasSubname ? e("span", { staticClass: "line-two__subname" }, [t._t("subname")], 2) : t._e(), t.counterNumber != 0 || t.hasIndicator ? e("span", { directives: [{ name: "show", rawName: "v-show", value: t.showAdditionalElements, expression: "showAdditionalElements" }], staticClass: "line-two__additional_elements" }, [t.counterNumber != 0 ? e("NcCounterBubble", { staticClass: "line-two__counter", attrs: { active: n || t.active, type: t.counterType } }, [t._v(" " + t._s(t.counterNumber) + " ")]) : t._e(), t.hasIndicator ? e("span", { staticClass: "line-two__indicator" }, [t._t("indicator")], 2) : t._e()], 1) : t._e()])]), t.forceDisplayActions ? t._e() : e("div", { directives: [{ name: "show", rawName: "v-show", value: t.displayActionsOnHoverFocus, expression: "displayActionsOnHoverFocus" }], staticClass: "list-item-content__actions", on: { click: function(s) {
      s.preventDefault(), s.stopPropagation();
    } } }, [e("NcActions", { ref: "actions", attrs: { primary: n || t.active, "aria-label": t.computedActionsAriaLabel }, on: { "update:open": t.handleActionsUpdateOpen } }, [t._t("actions")], 2)], 1)]), t.forceDisplayActions ? e("div", { staticClass: "list-item-content__actions", on: { click: function(s) {
      s.preventDefault(), s.stopPropagation();
    } } }, [e("NcActions", { ref: "actions", attrs: { primary: n || t.active, "aria-label": t.computedActionsAriaLabel }, on: { "update:open": t.handleActionsUpdateOpen } }, [t._t("actions")], 2)], 1) : t._e()], 2), t.$slots.extra ? e("div", { staticClass: "list-item__extra" }, [t._t("extra")], 2) : t._e()])])];
  } }], null, !0) });
}, p = [], m = u(d, h, p, !1, null, "425183ac", null, null);
const w = m.exports;
export {
  w as default
};