@indielayer/ui
Version:
Indielayer UI Components with Tailwind CSS build for Vue 3
66 lines (65 loc) • 1.99 kB
JavaScript
import { defineComponent as h, computed as f, openBlock as o, createElementBlock as m, normalizeClass as n, unref as l, normalizeStyle as c, createBlock as g, resolveDynamicComponent as v, mergeProps as y, withCtx as b, createElementVNode as w, renderSlot as p } from "vue";
import { useTheme as S } from "../../composables/useTheme.js";
const i = {
textAlign: [null, "left", "center", "right", "justify"],
verticalAlign: [null, "baseline", "bottom", "middle", "text-bottom", "text-top", "top"]
}, C = {
textAlign: {
type: String,
validator: (a) => i.textAlign.includes(a)
},
truncate: Boolean,
dense: Boolean,
width: [String, Number],
verticalAlign: {
type: String,
default: "middle",
validator: (a) => i.verticalAlign.includes(a)
},
to: [String, Object],
href: String,
target: String
}, k = {
name: "XTableCell",
validators: i
}, N = /* @__PURE__ */ h({
...k,
props: C,
setup(a) {
const r = a, t = f(() => typeof r.width == "number" ? `${r.width}px` : r.width), { styles: s, classes: d, className: u } = S("TableCell", {}, r);
return (e, A) => e.to || e.href ? (o(), m("td", {
key: 0,
class: n(["relative", l(u)]),
style: c([{ width: t.value, minWidth: t.value, maxWidth: t.value }])
}, [
(o(), g(v(e.to ? "router-link" : "a"), y(e.href ? { href: e.href } : {}, {
target: e.target,
to: e.to,
style: l(s),
class: l(d).wrapper
}), {
default: b(() => [
w("div", {
class: n([e.truncate ? "truncate" : ""])
}, [
p(e.$slots, "default")
], 2)
]),
_: 3
}, 16, ["target", "to", "style", "class"]))
], 6)) : (o(), m("td", {
key: 1,
style: c([l(s), { width: t.value, minWidth: t.value, maxWidth: t.value }]),
class: n([
"relative",
l(u),
l(d).wrapper
])
}, [
p(e.$slots, "default")
], 6));
}
});
export {
N as default
};