@aotearoan/neon
Version:
Neon is a lightweight design library of Vue 3 components with minimal dependencies.
76 lines (75 loc) • 2.78 kB
JavaScript
import $ from "./NeonCardList.es.js";
import { resolveComponent as t, openBlock as o, createElementBlock as s, createVNode as i, withCtx as a, renderSlot as c, toDisplayString as r, createCommentVNode as g, Fragment as k, renderList as C, createBlock as d, normalizeProps as b, guardReactiveProps as _ } from "vue";
import N from "../../../_virtual/_plugin-vue_export-helper.es.js";
const B = { class: "neon-card-list" }, L = {
key: 0,
class: "neon-card-list__total"
}, S = {
key: 0,
class: "neon-card-list__results-end"
};
function v(e, m, w, z, F, P) {
const p = t("neon-inline"), u = t("neon-card-list-card"), f = t("neon-link"), h = t("neon-stack"), y = t("neon-button");
return o(), s("div", B, [
i(p, {
breakpoint: "",
class: "neon-card-list__header"
}, {
default: a(() => [
c(e.$slots, "header"),
e.total ? (o(), s("span", L, r(e.n(e.model.length)) + " " + r(e.ofLabel) + " " + r(e.n(e.total)), 1)) : g("", !0)
]),
_: 3
}),
i(h, { class: "neon-card-list__cards" }, {
default: a(() => [
(o(!0), s(k, null, C(e.model, (n, l) => (o(), s(k, null, [
n.href && !n.disabled ? (o(), d(f, {
key: `${n.key || l}-link`,
href: n.href,
target: n.targetBlank ? "_blank" : null
}, {
default: a(() => [
i(u, {
color: e.color,
disabled: n.disabled
}, {
default: a(() => [
c(e.$slots, "card", b(_({ cardModel: n, index: l })))
]),
_: 2
}, 1032, ["color", "disabled"])
]),
_: 2
}, 1032, ["href", "target"])) : (o(), d(u, {
key: `${n.key || l}-card`,
clickable: e.clickable && !n.disabled,
color: e.color,
disabled: n.disabled,
onClick: (R) => !n.disabled && e.emit("click", l)
}, {
default: a(() => [
c(e.$slots, "card", b(_({ cardModel: n, index: l })))
]),
_: 2
}, 1032, ["clickable", "color", "disabled", "onClick"]))
], 64))), 256))
]),
_: 3
}),
e.model.length === e.total ? (o(), s("span", S, r(e.endOfResultsLabel), 1)) : (o(), d(y, {
key: 1,
"button-style": e.NeonButtonStyle.Text,
color: e.NeonFunctionalColor.Neutral,
label: e.showMoreLabel,
size: e.NeonSize.Small,
class: "neon-card-list__show-more",
onClick: m[0] || (m[0] = (n) => e.emit("show-more", n))
}, null, 8, ["button-style", "color", "label", "size"]))
]);
}
const O = /* @__PURE__ */ N($, [["render", v]]);
export {
O as default
};
//# sourceMappingURL=NeonCardList.vue.es.js.map