st-common-ui-vue3
Version:
小尾巴通用 Vue3 UI 组件库
65 lines (64 loc) • 2.66 kB
JavaScript
import { defineComponent as w, ref as l, watch as C, nextTick as S, openBlock as R, createElementBlock as E, withDirectives as f, createElementVNode as n, renderSlot as u, vShow as p, createVNode as v, withCtx as m, unref as W } from "vue";
import { useParentElement as P, useElementSize as k } from "../../node_modules/.pnpm/@vueuse_core@12.0.0_typescript@5.6.2/node_modules/@vueuse/core/index.js";
import _ from "../../hooks/use-element-contact-previous/index.js";
import c from "../../hooks/use-element-parent-children-width/index.js";
import x from "../StPopover/StPopover.vue.js";
import I from "../StIconIconify/StIconIconify.vue.js";
import b from "../../node_modules/.pnpm/@iconify-icons_tabler@1.2.95/node_modules/@iconify-icons/tabler/align-right.js";
const z = { class: "st-react-collapse__content" }, D = { class: "st-react-collapse__dropdown" }, $ = { class: "st-react-collapse__dropdown-icon" }, y = { class: "st-react-collapse__dropdown-content" }, A = /* @__PURE__ */ w({
name: "StReactCollapse",
__name: "StReactCollapse",
props: {
dropdownZIndex: { default: 1 }
},
setup(B) {
const o = l(), h = P(), { width: r } = k(h), a = l(!1), e = l(!1), d = l(0), t = l(!1), i = l(0);
return C(
r,
() => {
a.value = _(o), a.value && !e.value ? (d.value = c(o).offsetWidthSum, e.value = !0, S(() => {
a.value = _(o), a.value && e.value && !t.value && (i.value = c(o).offsetWidthSum, t.value = !0);
})) : a.value && e.value && !t.value && (i.value = c(o).offsetWidthSum, t.value = !0), r.value > d.value && e.value ? e.value = !1 : r.value > i.value && e.value && t.value && (t.value = !1);
},
{ immediate: !0 }
), (s, N) => (R(), E("div", {
class: "st-react-collapse",
ref_key: "stReactCollapseRef",
ref: o
}, [
f(n("div", z, [
u(s.$slots, "default", { isCollapse: e.value }, void 0, !0)
], 512), [
[p, !t.value]
]),
f(n("div", D, [
v(x, {
"is-vertical": "",
"sub-cont-z-index": s.dropdownZIndex
}, {
default: m(() => [
n("div", $, [
u(s.$slots, "dropdown-icon", {}, () => [
v(I, {
icon: W(b),
width: "24"
}, null, 8, ["icon"])
], !0)
])
]),
subContent: m(() => [
n("div", y, [
u(s.$slots, "dropdown-content", {}, void 0, !0)
])
]),
_: 3
}, 8, ["sub-cont-z-index"])
], 512), [
[p, t.value]
])
], 512));
}
});
export {
A as default
};