vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
93 lines (92 loc) • 3.22 kB
JavaScript
import { defineComponent as S, computed as u, createElementBlock as e, openBlock as a, createElementVNode as v, createCommentVNode as i, normalizeStyle as l, renderSlot as r, createVNode as h, unref as c, normalizeProps as k, guardReactiveProps as $, withCtx as w, createTextVNode as n, toDisplayString as d } from "vue";
import E from "../../avatar/index.js";
import { useSlotsExist as N } from "../../utils/index.js";
const P = { class: "list-item-wrap" }, C = { class: "list-item-main" }, V = {
key: 0,
class: "list-item-meta"
}, g = {
key: 1,
class: "list-item-content"
}, F = /* @__PURE__ */ S({
__name: "ListItem",
props: {
avatar: { default: void 0 },
avatarProps: { default: () => ({}) },
title: { default: void 0 },
description: { default: void 0 },
actions: { type: Function, default: void 0 },
extra: { default: void 0 },
avatarStyle: { default: () => ({}) },
titleStyle: { default: () => ({}) },
descriptionStyle: { default: () => ({}) },
contentStyle: { default: () => ({}) },
actionsStyle: { default: () => ({}) },
extraStyle: { default: () => ({}) }
},
setup(y) {
const o = y, s = N(["avatar", "title", "description", "default", "actions", "extra"]), p = u(() => s.avatar || o.avatar || JSON.stringify(o.avatarProps) !== "{}"), m = u(() => s.title || s.description || o.title || o.description), f = u(() => s.extra || o.extra);
return (t, z) => (a(), e("div", P, [
v("div", C, [
p.value || m.value ? (a(), e("div", V, [
p.value ? (a(), e("div", {
key: 0,
class: "list-item-avatar",
style: l(t.avatarStyle)
}, [
r(t.$slots, "avatar", {}, () => [
h(c(E), k($(t.avatarProps)), {
default: w(() => [
n(d(t.avatar), 1)
]),
_: 1
}, 16)
], !0)
], 4)) : i("", !0),
m.value ? (a(), e("div", g, [
v("p", {
class: "list-item-title",
style: l(t.titleStyle)
}, [
r(t.$slots, "title", {}, () => [
n(d(t.title), 1)
], !0)
], 4),
v("div", {
class: "list-item-description",
style: l(t.descriptionStyle)
}, [
r(t.$slots, "description", {}, () => [
n(d(t.description), 1)
], !0)
], 4)
])) : i("", !0)
])) : i("", !0),
c(s).default ? (a(), e("div", {
key: 1,
style: l(t.contentStyle)
}, [
r(t.$slots, "default", {}, void 0, !0)
], 4)) : i("", !0),
c(s).actions ? (a(), e("div", {
key: 2,
class: "list-item-actions",
style: l(t.actionsStyle)
}, [
r(t.$slots, "actions", {}, void 0, !0)
], 4)) : i("", !0)
]),
f.value ? (a(), e("div", {
key: 0,
class: "list-item-extra",
style: l(t.extraStyle)
}, [
r(t.$slots, "extra", {}, () => [
n(d(t.extra), 1)
], !0)
], 4)) : i("", !0)
]));
}
});
export {
F as default
};