@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
76 lines (75 loc) • 2.62 kB
JavaScript
import { defineComponent as L, inject as f, ref as c, reactive as T, toRef as B, computed as p, provide as E, watch as _, onMounted as $, onBeforeUnmount as w, resolveComponent as I, createElementBlock as a, openBlock as i, normalizeClass as u, unref as k, createElementVNode as V, createCommentVNode as v, withModifiers as z, normalizeStyle as H, renderSlot as y, Fragment as M, renderList as R, createBlock as j, withCtx as D, createTextVNode as F, toDisplayString as K } from "vue";
import { useNameHelper as O } from "@vexip-ui/config";
import { anchorLinkProps as P } from "./props.mjs";
import { ANCHOR_STATE as U, LINK_STATE as A, baseIndentWidth as W } from "./symbol.mjs";
const q = ["href", "title"], Z = /* @__PURE__ */ L({
name: "AnchorLink",
__name: "anchor-link",
props: P,
setup(C) {
const s = C, t = f(U, null), n = f(A, null), r = O("anchor"), d = c(n != null && n.indent ? (n == null ? void 0 : n.indent) + 1 : 1), m = c(!1), h = c(), l = T({
el: h,
to: B(s, "to"),
active: m,
indent: d
}), g = p(() => ({
[r.be("link")]: !0,
[r.bem("link", "active")]: l.active
})), b = p(() => ({
paddingInlineStart: `${W * d.value}px`
}));
E(A, l), t && (_(
() => t.currentActive,
(e) => {
m.value = e === s.to;
}
), $(() => {
t.increaseLink(l);
}), w(() => {
t.decreaseLink(l);
}));
function N() {
return t && t.handleActive(s.to), !1;
}
return (e, G) => {
const S = I("AnchorLink", !0);
return i(), a("li", {
class: u(k(r).be("item"))
}, [
V("a", {
ref_key: "link",
ref: h,
class: u(g.value),
href: e.to,
style: H(b.value),
title: e.title,
onClick: z(N, ["prevent"])
}, [
y(e.$slots, "default")
], 14, q),
e.$slots.group || e.children && e.children.length ? (i(), a("ul", {
key: 0,
class: u(k(r).be("list"))
}, [
y(e.$slots, "group", {}, () => [
e.children && e.children.length ? (i(!0), a(M, { key: 0 }, R(e.children, (o) => (i(), j(S, {
key: o.to,
to: o.to,
title: o.title,
children: o.children
}, {
default: D(() => [
F(K(o.label), 1)
]),
_: 2
}, 1032, ["to", "title", "children"]))), 128)) : v("", !0)
])
], 2)) : v("", !0)
], 2);
};
}
});
export {
Z as default
};
//# sourceMappingURL=anchor-link.vue2.mjs.map