@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
66 lines (65 loc) • 2.04 kB
JavaScript
import { defineComponent as v, reactive as s, computed as m, toRef as l, provide as _, createElementBlock as C, openBlock as S, normalizeStyle as E, unref as p, normalizeClass as k, renderSlot as x } from "vue";
import { useProps as y, useNameHelper as I, emitEvent as N } from "@vexip-ui/config";
import { debounceMinor as T, isNull as A } from "@vexip-ui/utils";
import { timelineProps as M } from "./props.mjs";
import { TIMELINE_STATE as B } from "./symbol.mjs";
const j = /* @__PURE__ */ v({
name: "Timeline",
__name: "timeline",
props: M,
setup(c, { expose: f }) {
const e = y("timeline", c, {
pending: !1,
dashed: !1,
lineColor: null,
spacing: null,
flip: !1,
horizontal: !1,
alternate: !1
}), n = I("timeline"), o = s(/* @__PURE__ */ new Set()), d = m(() => ({
[n.b()]: !0,
[n.bs("vars")]: !0,
[n.bm("inherit")]: e.inherit,
[n.bm("pending")]: e.pending,
[n.bm("alternate")]: e.alternate,
[n.bm("flip")]: e.flip,
[n.bm("horizontal")]: e.horizontal
})), h = m(() => Math.max(...Array.from(o).map((t) => t.height)) * 2);
f({ itemStates: o });
const r = T(() => {
const t = o.size;
Array.from(o).forEach((a, i) => {
a.index = i + 1, a.total = t, A(a.label) && (a.label = i + 1);
});
}), u = s({
dashed: l(e, "dashed"),
lineColor: l(e, "lineColor"),
spacing: l(e, "spacing"),
alternate: l(e, "alternate"),
horizontal: l(e, "horizontal"),
increaseItem: b,
decreaseItem: g,
handleSignalClick: z
});
_(B, u);
function b(t) {
o.add(t), r();
}
function g(t) {
o.delete(t), r();
}
function z(t) {
N(e.onSignalClick, t);
}
return (t, a) => (S(), C("div", {
class: k(d.value),
style: E({ height: p(e).horizontal && p(e).alternate ? `${h.value}px` : void 0 })
}, [
x(t.$slots, "default")
], 6));
}
});
export {
j as default
};
//# sourceMappingURL=timeline.vue2.mjs.map