vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
76 lines (75 loc) • 2.81 kB
JavaScript
import { defineComponent as S, createElementBlock as l, openBlock as t, normalizeClass as a, unref as e, createElementVNode as m, createBlock as v, createCommentVNode as n, createVNode as c, normalizeStyle as T, Fragment as B, renderList as D, toDisplayString as x, withModifiers as z, KeepAlive as V, renderSlot as A } from "vue";
import { useTabs as F } from "./hook/useTabs.mjs";
import { Icon as r } from "@vuux/icons";
const K = { class: "tabs-head" }, L = ["onClick"], M = ["onClick"], q = /* @__PURE__ */ S({
name: "Tabs",
__name: "index",
props: {
active: { default: "" },
remove: { type: Boolean },
position: { default: "top" }
},
emits: ["select", "remove"],
setup(k, { emit: h }) {
const u = k, y = h, { state: C, list: i, headDataEl: _, headItemEl: E, classNames: I, isArrow: d, isDisabled: f, tabClassNames: $, handleSelectTab: b, handleRemoveTab: g, handleScrollTabs: p } = F(u, y);
return (w, o) => (t(), l("div", {
class: a(["app-tabs", e(I)])
}, [
m("div", K, [
e(d) ? (t(), l("div", {
key: 0,
class: a(["head-arrow is-left", { "is-disabled": e(f) }]),
onClick: o[0] || (o[0] = (s) => e(p)(-1))
}, [
c(e(r), { name: "Icon3498333" })
], 2)) : n("", !0),
e(i).length > 0 ? (t(), l("div", {
key: 1,
ref_key: "headDataEl",
ref: _,
class: a(["head-data", { "is-arrow": e(d) }]),
style: T({ transform: `translateX(-${e(C).scrollOffset}px)` })
}, [
(t(!0), l(B, null, D(e(i), (s, O) => (t(), l("div", {
key: s.id,
ref_for: !0,
ref_key: "headItemEl",
ref: E,
class: a(["data-item", e($)(s)]),
onClick: (N) => e(b)(s)
}, [
s.icon ? (t(), v(e(r), {
key: 0,
name: s.icon
}, null, 8, ["name"])) : n("", !0),
m("p", null, x(s.name), 1),
e(i).length > 1 && u.remove ? (t(), l("div", {
key: 1,
class: "is-close",
onClick: z((N) => e(g)(s), ["stop"])
}, [
c(e(r), {
name: "Icon9176904",
size: 12
})
], 8, M)) : n("", !0),
o[2] || (o[2] = m("div", { class: "is-lines" }, null, -1))
], 10, L))), 128))
], 6)) : n("", !0),
e(d) ? (t(), l("div", {
key: 2,
class: a(["head-arrow is-right", { "is-disabled": e(f) }]),
onClick: o[1] || (o[1] = (s) => e(p)(1))
}, [
c(e(r), { name: "Icon6657361" })
], 2)) : n("", !0)
]),
(t(), v(V, null, [
A(w.$slots, "default")
], 1024))
], 2));
}
});
export {
q as default
};