@czxingyu/xycomponents 0.1.0

package/dist/tree-select/tree-select.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,832 @@
+import { resolveSemanticClassNames as e, resolveSemanticStyles as t } from "../core/shared/index.js";
+import { provideXyFormControl as n, useXyFormControl as r } from "../core/control/index.js";
+import { useXyLocale as i } from "../core/locale/index.js";
+import a from "../icon/icon.js";
+import ee from "../select/select.js";
+import o from "../checkbox/checkbox.js";
+import { Fragment as te, computed as s, createBlock as ne, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as re, createVNode as d, defineComponent as f, getCurrentInstance as ie, mergeProps as ae, nextTick as oe, normalizeClass as p, normalizeStyle as m, openBlock as h, ref as g, renderList as se, renderSlot as _, toDisplayString as v, unref as y, useId as ce, watch as le, withCtx as ue, withModifiers as de } from "vue";
+//#region components/tree-select/tree-select.vue?vue&type=script&setup=true&lang.ts
+var fe = { class: "xy-tree-select__popup" }, pe = [
+	"id",
+	"aria-label",
+	"placeholder",
+	"value"
+], me = ["aria-label"], he = ["aria-label", "aria-multiselectable"], ge = [
+	"id",
+	"aria-checked",
+	"aria-disabled",
+	"aria-expanded",
+	"aria-level",
+	"aria-posinset",
+	"aria-selected",
+	"aria-setsize",
+	"tabindex",
+	"onFocus",
+	"onKeydown",
+	"onMouseenter"
+], _e = {
+	key: 0,
+	class: "xy-tree-select__line-guides",
+	"aria-hidden": "true"
+}, ve = ["aria-label", "onClick"], ye = {
+	key: 2,
+	class: "xy-tree-select__switcher",
+	"aria-hidden": "true"
+}, be = ["disabled", "onClick"], xe = /*@__PURE__*/ f({
+	name: "XyTreeSelect",
+	__name: "tree-select",
+	props: {
+		allowClear: {
+			default: !0,
+			type: Boolean
+		},
+		ariaLabel: {
+			default: "",
+			type: String
+		},
+		autoClearSearchValue: {
+			default: !0,
+			type: Boolean
+		},
+		autofocus: {
+			default: !1,
+			type: Boolean
+		},
+		classNames: { type: [
+			Object,
+			Array,
+			Function
+		] },
+		defaultOpen: {
+			default: !1,
+			type: Boolean
+		},
+		disabled: { type: Boolean },
+		error: {
+			default: "",
+			type: String
+		},
+		filterTreeNode: {
+			default: !0,
+			type: [Boolean, Function]
+		},
+		id: { type: String },
+		label: {
+			default: "",
+			type: String
+		},
+		loadData: { type: Function },
+		loading: {
+			default: !1,
+			type: Boolean
+		},
+		maxCount: {
+			default: Infinity,
+			type: Number
+		},
+		maxTagCount: {
+			default: 3,
+			type: Number
+		},
+		maxTagTextLength: { type: Number },
+		modelValue: {
+			default: "",
+			type: null
+		},
+		multiple: {
+			default: !1,
+			type: Boolean
+		},
+		notFoundContent: { type: String },
+		open: { type: Boolean },
+		placeholder: { type: String },
+		placement: {
+			default: "bottomLeft",
+			type: String
+		},
+		popupMatchSelectWidth: {
+			default: !0,
+			type: [Boolean, Number]
+		},
+		readonly: { type: Boolean },
+		searchable: {
+			default: !0,
+			type: Boolean
+		},
+		searchPlaceholder: { type: String },
+		showCheckedStrategy: {
+			default: "child",
+			type: String
+		},
+		showSearch: {
+			default: !1,
+			type: Boolean
+		},
+		size: { type: String },
+		status: { type: String },
+		styles: { type: [
+			Object,
+			Array,
+			Function
+		] },
+		treeCheckable: {
+			default: !1,
+			type: Boolean
+		},
+		treeCheckStrictly: {
+			default: !1,
+			type: Boolean
+		},
+		treeData: {
+			default: () => [],
+			type: Array
+		},
+		treeDefaultExpandAll: {
+			default: !1,
+			type: Boolean
+		},
+		treeDefaultExpandedKeys: {
+			default: () => [],
+			type: Array
+		},
+		treeExpandedKeys: { type: Array },
+		treeLine: {
+			default: !1,
+			type: Boolean
+		},
+		variant: {
+			default: "outlined",
+			type: String
+		}
+	},
+	emits: [
+		"blur",
+		"change",
+		"clear",
+		"deselect",
+		"expand",
+		"focus",
+		"load-error",
+		"open-change",
+		"search",
+		"select",
+		"update:modelValue",
+		"update:open",
+		"update:treeExpandedKeys"
+	],
+	setup(f, { expose: xe, emit: Se }) {
+		let b = f, x = Se;
+		function Ce(e) {
+			let t = [], n = (e) => {
+				for (let r of e) r.children?.length && (t.push(r.value), n(r.children));
+			};
+			return n(e), t;
+		}
+		let S = r(() => b), C = i();
+		n({
+			describedBy: S.describedBy,
+			disabled: S.disabled,
+			id: S.id,
+			labelledBy: S.labelledBy,
+			readonly: S.readonly,
+			size: S.size,
+			status: S.status
+		});
+		let we = ie(), w = g(), Te = g(), Ee = g(b.defaultOpen), De = g(new Set(b.treeDefaultExpandAll ? Ce(b.treeData) : b.treeDefaultExpandedKeys)), T = g(""), E = g(), D = g(/* @__PURE__ */ new Set()), O = g(null), Oe = g(0), k = `${ce()}-tree-select-tree`;
+		function ke(...e) {
+			let t = we?.vnode.props ?? {};
+			return e.some((e) => Object.prototype.hasOwnProperty.call(t, e));
+		}
+		let Ae = s(() => ke("open")), je = s(() => ke("treeExpandedKeys", "tree-expanded-keys")), A = s(() => Ae.value ? !!b.open : Ee.value), j = s(() => new Set(je.value ? b.treeExpandedKeys ?? [] : De.value)), M = s(() => b.multiple || b.treeCheckable), N = s(() => b.searchable || b.showSearch), Me = s(() => b.ariaLabel || b.label || C.value.treeSelect.ariaLabel), Ne = s(() => b.notFoundContent ?? C.value.treeSelect.notFoundContent), Pe = s(() => b.placeholder ?? C.value.treeSelect.placeholder), Fe = s(() => b.searchPlaceholder ?? C.value.treeSelect.searchPlaceholder), P = s(() => !!T.value && b.filterTreeNode !== !1), F = s(() => e(b.classNames, b)), I = s(() => t(b.styles, b)), Ie = s(() => ({
+			arrow: F.value.arrow,
+			clear: F.value.clear,
+			dropdown: F.value.dropdown,
+			tag: F.value.tag,
+			trigger: F.value.trigger,
+			value: F.value.value
+		})), Le = s(() => ({
+			arrow: I.value.arrow,
+			clear: I.value.clear,
+			dropdown: I.value.dropdown,
+			tag: I.value.tag,
+			trigger: I.value.trigger,
+			value: I.value.value
+		})), L = s(() => {
+			Oe.value;
+			let e = [], t = 0, n = (r, i = 0, a, ee = []) => {
+				r.forEach((o, te) => {
+					let s = [...ee, o];
+					e.push({
+						depth: i,
+						index: t,
+						node: o,
+						parent: a,
+						path: s,
+						posInSet: te + 1,
+						setSize: r.length
+					}), t += 1, o.children?.length && n(o.children, i + 1, o, s);
+				});
+			};
+			return n(b.treeData), e;
+		}), R = s(() => new Map(L.value.map((e) => [e.node, e]))), Re = s(() => new Map(L.value.map((e) => [e.node.value, e.node])));
+		function z(e) {
+			return typeof e == "boolean" ? `boolean:${e ? "1" : "0"}` : typeof e == "number" ? `number:${String(e)}` : `string:${e}`;
+		}
+		let B = s(() => {
+			let e = Array.isArray(b.modelValue) ? b.modelValue : b.modelValue === "" || b.modelValue === void 0 ? [] : [b.modelValue];
+			return M.value ? e : e.slice(0, 1);
+		}), V = s(() => new Set(B.value)), ze = s(() => {
+			let e = /* @__PURE__ */ new Map();
+			for (let t of L.value) e.set(z(t.node.value), t.node.value);
+			for (let t of B.value) e.set(z(t), t);
+			return e;
+		});
+		function H(e) {
+			return V.value.has(e.value);
+		}
+		function Be(e) {
+			return !e.disabled && !e.disableCheckbox && e.checkable !== !1;
+		}
+		function Ve(e) {
+			if (e.disabled) return [];
+			let t = Be(e) ? [e.value] : [];
+			for (let n of e.children ?? []) t.push(...Ve(n));
+			return t;
+		}
+		function He(e) {
+			return (e.children ?? []).flatMap(Ve);
+		}
+		function U(e) {
+			if (!b.treeCheckable || b.treeCheckStrictly) return !1;
+			let t = He(e);
+			if (!t.length) return !1;
+			let n = t.filter((e) => V.value.has(e)).length;
+			return n > 0 && (!H(e) || n < t.length);
+		}
+		function Ue(e) {
+			return e.path.slice(0, -1).some((e) => V.value.has(e.value));
+		}
+		function We(e) {
+			return L.value.some((t) => t.depth > e.depth && t.path.includes(e.node) && V.value.has(t.node.value));
+		}
+		let Ge = s(() => !b.treeCheckable || b.treeCheckStrictly || b.showCheckedStrategy === "all" ? B.value : B.value.filter((e) => {
+			let t = L.value.find((t) => Object.is(t.node.value, e));
+			return t ? b.showCheckedStrategy === "parent" ? !Ue(t) : !We(t) : !0;
+		})), Ke = s(() => {
+			let e = L.value.map((e) => ({
+				disabled: e.node.disabled,
+				label: e.node.label,
+				value: z(e.node.value)
+			})), t = new Set(e.map((e) => e.value));
+			for (let n of B.value) {
+				let r = z(n);
+				t.has(r) || e.push({
+					label: String(n),
+					value: r
+				});
+			}
+			return e;
+		}), qe = s(() => {
+			let e = Ge.value.map(z);
+			return M.value ? e : e[0] ?? "";
+		});
+		function Je(e) {
+			return T.value ? typeof b.filterTreeNode == "function" ? b.filterTreeNode(T.value, e) : e.label.toLocaleLowerCase().includes(T.value.toLocaleLowerCase()) : !0;
+		}
+		function Ye(e) {
+			return !!e.children?.some((e) => Je(e) || Ye(e));
+		}
+		let W = s(() => {
+			let e = [], t = (n) => {
+				for (let r of n) {
+					let n = R.value.get(r);
+					n && (!P.value || Je(r) || Ye(r)) && (e.push(n), r.children?.length && (P.value || j.value.has(r.value)) && t(r.children));
+				}
+			};
+			return t(b.treeData), e;
+		});
+		function Xe(e) {
+			return W.value.some((t) => t.parent === e.parent && t.posInSet > e.posInSet);
+		}
+		function Ze(e) {
+			let t = [], n = e.parent;
+			for (; n;) {
+				let e = R.value.get(n);
+				if (!e) break;
+				Xe(e) && t.push(e.depth), n = e.parent;
+			}
+			return t;
+		}
+		let G = s(() => W.value.findIndex((e) => Object.is(e.node.value, E.value))), Qe = s(() => A.value && G.value >= 0 ? tt(W.value[G.value]) : "");
+		function K(e) {
+			return e.isLeaf === !0 ? !1 : e.isLeaf === !1 || !!e.children?.length;
+		}
+		function q(e) {
+			return K(e) ? !!(P.value && e.children?.length || j.value.has(e.value)) : !1;
+		}
+		function $e(e) {
+			return !!(e.loading || D.value.has(z(e.value)));
+		}
+		function J(e) {
+			if (b.loading || S.disabled.value || S.readonly.value || e.disabled) return !0;
+			let t = B.value.length >= b.maxCount;
+			return b.treeCheckable ? e.disableCheckbox || e.checkable === !1 || t && !H(e) : e.selectable === !1 || t && !V.value.has(e.value);
+		}
+		function et(e) {
+			return !!(b.loading || S.disabled.value || S.readonly.value || e.disabled);
+		}
+		function tt(e) {
+			return `${k}-node-${e.index}`;
+		}
+		function nt(e) {
+			return {
+				"--xy-tree-depth": e.depth,
+				paddingInlineStart: `${e.depth * 20 + 4}px`,
+				...I.value.node
+			};
+		}
+		function rt(e, t) {
+			return {
+				active: t === G.value,
+				checked: H(e.node),
+				disabled: J(e.node),
+				expanded: q(e.node),
+				halfChecked: U(e.node),
+				loading: $e(e.node),
+				node: e.node,
+				path: e.path,
+				selected: V.value.has(e.node.value)
+			};
+		}
+		function Y(e) {
+			return ze.value.get(String(e));
+		}
+		function it(e) {
+			let t = Y(e);
+			return t === void 0 ? void 0 : Re.value.get(t);
+		}
+		function at(e) {
+			let t = Y(e);
+			return it(e)?.label ?? String(t ?? e);
+		}
+		function ot(e) {
+			let t = [];
+			for (let n of e) t.some((e) => Object.is(e, n)) || t.push(n);
+			return t;
+		}
+		function st(e, t) {
+			return e.length === t.length && e.every((e, n) => Object.is(e, t[n]));
+		}
+		function X(e, t, n) {
+			let r = ot(e);
+			if (M.value && r.length > b.maxCount && r.length >= B.value.length) return !1;
+			let i = M.value ? r : r.slice(0, 1);
+			if (st(i, B.value)) return !1;
+			let a = M.value ? i : i[0] ?? "", ee = i.map((e) => Re.value.get(e)).filter((e) => !!e);
+			return x("update:modelValue", a), x("change", a, ee), t && n === "select" && x("select", t.value, t), n === "deselect" && x("deselect", t?.value ?? i[0], t), S.notifyChange(a), !0;
+		}
+		function ct(e, t) {
+			let n = R.value.get(t)?.parent;
+			for (; n;) {
+				let t = He(n);
+				Be(n) && (t.length > 0 && t.every((t) => e.has(t)) ? e.add(n.value) : e.delete(n.value)), n = R.value.get(n)?.parent;
+			}
+		}
+		function lt(e, t) {
+			let n = t ?? !H(e);
+			if (S.disabled.value || S.readonly.value || b.loading || n && !Be(e)) return !1;
+			let r = new Set(B.value), i = b.treeCheckStrictly ? [e.value] : Ve(e);
+			for (let e of i) n ? r.add(e) : r.delete(e);
+			b.treeCheckStrictly || ct(r, e);
+			let a = X([...r], e, n ? "select" : "deselect");
+			return a && b.autoClearSearchValue && T.value && Z(""), a;
+		}
+		function ut(e, t) {
+			let n = V.value.has(e.value), r = t ?? !n;
+			if (S.disabled.value || S.readonly.value || b.loading || r && (e.disabled || e.selectable === !1)) return !1;
+			let i = B.value.filter((t) => !Object.is(t, e.value));
+			r && i.push(e.value);
+			let a = X(i, e, r ? "select" : "deselect");
+			return a && b.autoClearSearchValue && T.value && Z(""), a;
+		}
+		function dt() {
+			Q(!1), oe(() => w.value?.focus());
+		}
+		function ft(e) {
+			if (!J(e)) {
+				if (b.treeCheckable) {
+					lt(e);
+					return;
+				}
+				if (b.multiple) {
+					ut(e);
+					return;
+				}
+				X([e.value], e, "select") && (T.value &&= "", dt());
+			}
+		}
+		function pt(e) {
+			let t = Y(e);
+			if (t === void 0) return;
+			let n = Re.value.get(t);
+			if (n) {
+				b.treeCheckable ? lt(n, !1) : ut(n, !1);
+				return;
+			}
+			X(B.value.filter((e) => !Object.is(e, t)), void 0, "deselect");
+		}
+		function mt() {
+			X([]) && (T.value = "", x("clear"));
+		}
+		function Z(e) {
+			T.value = e, x("search", e), _t();
+		}
+		function Q(e, t = null) {
+			if (!(e && (S.disabled.value || S.readonly.value))) {
+				if (O.value = e ? t : null, A.value === e) {
+					e && vt();
+					return;
+				}
+				Ae.value || (Ee.value = e), x("update:open", e), x("open-change", e);
+			}
+		}
+		function ht(e) {
+			Q(e, e && N.value ? "search" : "tree");
+		}
+		function gt(e) {
+			x("blur", e), S.notifyBlur(e);
+		}
+		function _t() {
+			E.value !== void 0 && W.value.some((e) => Object.is(e.node.value, E.value)) || (E.value = W.value.find((e) => V.value.has(e.node.value))?.node.value ?? W.value[0]?.node.value);
+		}
+		async function $(e) {
+			let t = W.value[e];
+			t && (E.value = t.node.value, await oe(), document.getElementById(tt(t))?.focus());
+		}
+		async function vt() {
+			await oe();
+			let e = O.value;
+			if (O.value = null, A.value) {
+				if (e === "search" && N.value) {
+					Te.value?.focus();
+					return;
+				}
+				e === "tree" && (_t(), await $(Math.max(G.value, 0)));
+			}
+		}
+		async function yt(e) {
+			if (!b.loadData || e.isLeaf !== !1 || e.children?.length || e.loading) return !0;
+			let t = z(e.value);
+			if (D.value.has(t)) return !1;
+			D.value = new Set(D.value).add(t);
+			let n = R.value.get(e)?.path ?? [e];
+			try {
+				return await b.loadData(e, n), Oe.value += 1, !0;
+			} catch (t) {
+				return x("load-error", t, e, n), !1;
+			} finally {
+				let e = new Set(D.value);
+				e.delete(t), D.value = e;
+			}
+		}
+		async function bt(e, t) {
+			if (!K(e) || t && b.loadData && e.isLeaf === !1 && !e.children?.length && !e.loading && !await yt(e)) return !1;
+			let n = new Set(j.value);
+			if (t ? n.add(e.value) : n.delete(e.value), n.has(e.value) === j.value.has(e.value)) return !0;
+			je.value || (De.value = n);
+			let r = [...n];
+			return x("update:treeExpandedKeys", r), x("expand", r, e, t), !0;
+		}
+		function xt(e) {
+			return bt(e, !j.value.has(e.value));
+		}
+		function St(e, t) {
+			xt(e).finally(() => $(t));
+		}
+		function Ct(e, t) {
+			let n = W.value.length;
+			n && $((e + t + n) % n);
+		}
+		async function wt(e, t, n) {
+			if (e.key === "Tab") {
+				Q(!1);
+				return;
+			}
+			if ([
+				" ",
+				"ArrowDown",
+				"ArrowLeft",
+				"ArrowRight",
+				"ArrowUp",
+				"End",
+				"Enter",
+				"Escape",
+				"Home",
+				"Spacebar"
+			].includes(e.key)) {
+				if (e.preventDefault(), e.stopPropagation(), e.key === "Escape") {
+					dt();
+					return;
+				}
+				if (e.key === "ArrowDown") {
+					Ct(n, 1);
+					return;
+				}
+				if (e.key === "ArrowUp") {
+					Ct(n, -1);
+					return;
+				}
+				if (e.key === "Home" || e.key === "End") {
+					$(e.key === "Home" ? 0 : W.value.length - 1);
+					return;
+				}
+				if (e.key === "ArrowRight" && K(t.node)) {
+					if (!q(t.node)) await bt(t.node, !0);
+					else {
+						let e = W.value.findIndex((e, r) => r > n && e.parent === t.node);
+						e >= 0 && await $(e);
+					}
+					return;
+				}
+				if (e.key === "ArrowLeft") {
+					if (q(t.node) && !P.value) {
+						await bt(t.node, !1);
+						return;
+					}
+					let e = W.value.findIndex((e) => e.node === t.parent);
+					e >= 0 && await $(e);
+					return;
+				}
+				(e.key === "Enter" || e.key === " " || e.key === "Spacebar") && ft(t.node);
+			}
+		}
+		function Tt(e) {
+			if (e.key === "Tab") {
+				Q(!1);
+				return;
+			}
+			if (e.key === "Escape") {
+				e.preventDefault(), e.stopPropagation(), dt();
+				return;
+			}
+			(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), e.stopPropagation(), $(e.key === "ArrowDown" ? 0 : W.value.length - 1));
+		}
+		function Et(e) {
+			if (e.target.classList.contains("xy-select__trigger") && [
+				" ",
+				"ArrowDown",
+				"ArrowUp",
+				"End",
+				"Enter",
+				"Escape",
+				"Home",
+				"Spacebar"
+			].includes(e.key)) {
+				if (e.preventDefault(), e.stopPropagation(), e.key === "Escape") {
+					A.value && dt();
+					return;
+				}
+				if (!A.value) {
+					Q(!0, N.value ? "search" : "tree");
+					return;
+				}
+				O.value = N.value ? "search" : "tree", vt();
+			}
+		}
+		return le(A, (e) => {
+			e ? (_t(), vt()) : (T.value = "", O.value = null);
+		}, { immediate: !0 }), le(W, _t), le(N, (e) => {
+			e || (T.value = "");
+		}), xe({
+			blur: () => w.value?.blur(),
+			focus: (e) => w.value?.focus(e),
+			get nativeElement() {
+				return w.value?.nativeElement;
+			}
+		}), (e, t) => (h(), l("div", {
+			class: p(["xy-tree-select", F.value.root]),
+			style: m(I.value.root),
+			onKeydownCapture: Et
+		}, [d(ee, {
+			ref_key: "selectRef",
+			ref: w,
+			"allow-clear": f.allowClear,
+			"aria-active-descendant": Qe.value,
+			"aria-controls": k,
+			"aria-haspopup": "tree",
+			"aria-label": Me.value,
+			autofocus: f.autofocus,
+			"class-names": Ie.value,
+			disabled: f.disabled,
+			error: f.error,
+			id: f.id,
+			label: f.label,
+			loading: f.loading,
+			"max-count": f.maxCount,
+			"max-tag-count": f.maxTagCount,
+			"max-tag-text-length": f.maxTagTextLength,
+			"model-value": qe.value,
+			multiple: M.value,
+			open: A.value,
+			options: Ke.value,
+			placeholder: Pe.value,
+			placement: f.placement,
+			"popup-match-select-width": f.popupMatchSelectWidth,
+			readonly: f.readonly,
+			size: f.size,
+			status: f.status,
+			styles: Le.value,
+			variant: f.variant,
+			onBlur: gt,
+			onClear: mt,
+			onDeselect: pt,
+			onFocus: t[3] ||= (e) => x("focus", e),
+			onOpenChange: ht
+		}, {
+			selection: ue(({ multiple: t, remove: n, value: r }) => [u("span", {
+				class: p(["xy-tree-select__selection", F.value.selection]),
+				style: m(I.value.selection)
+			}, [_(e.$slots, "selection", {
+				label: at(r),
+				multiple: t,
+				node: it(r),
+				remove: n,
+				value: Y(r)
+			}, () => [re(v(at(r)), 1)], !0)], 6)]),
+			suffix: ue(() => [_(e.$slots, "suffix", {}, () => [d(a, {
+				name: f.loading ? "loading-outlined" : "down-outlined",
+				size: 12,
+				spin: f.loading
+			}, null, 8, ["name", "spin"])], !0)]),
+			dropdown: ue(() => [u("div", fe, [N.value ? (h(), l("div", {
+				key: 0,
+				class: p(["xy-tree-select__search", F.value.search]),
+				style: m(I.value.search)
+			}, [
+				d(a, {
+					name: "search-outlined",
+					size: 13
+				}),
+				u("input", {
+					id: `${k}-search`,
+					ref_key: "searchRef",
+					ref: Te,
+					"aria-controls": k,
+					"aria-label": y(C).treeSelect.searchAriaLabel,
+					autocomplete: "off",
+					placeholder: Fe.value,
+					role: "searchbox",
+					type: "text",
+					value: T.value,
+					onInput: t[0] ||= (e) => Z(e.target.value),
+					onKeydown: Tt
+				}, null, 40, pe),
+				T.value ? (h(), l("button", {
+					key: 0,
+					type: "button",
+					"aria-label": y(C).treeSelect.clearSearchAriaLabel,
+					onClick: t[1] ||= (e) => {
+						Z(""), Te.value?.focus();
+					}
+				}, [d(a, {
+					name: "close-circle-filled",
+					size: 13
+				})], 8, me)) : c("", !0)
+			], 6)) : c("", !0), f.loading ? (h(), l("div", {
+				key: 1,
+				id: k,
+				class: p(["xy-tree-select__loading", F.value.loading]),
+				style: m(I.value.loading),
+				role: "status",
+				"aria-live": "polite"
+			}, [_(e.$slots, "loading", {}, () => [d(a, {
+				name: "loading-outlined",
+				size: 14,
+				spin: ""
+			}), u("span", null, v(y(C).treeSelect.loading), 1)], !0)], 6)) : (h(), l("div", {
+				key: 2,
+				id: k,
+				class: p(["xy-tree-select__tree", [{ "xy-tree-select__tree--line": f.treeLine }, F.value.tree]]),
+				style: m(I.value.tree),
+				role: "tree",
+				"aria-label": Me.value,
+				"aria-multiselectable": M.value || void 0
+			}, [(h(!0), l(te, null, se(W.value, (n, r) => (h(), l("div", {
+				id: tt(n),
+				key: `${z(n.node.value)}-${n.index}`,
+				class: p(["xy-tree-select__node", [{
+					"xy-tree-select__node--active": r === G.value,
+					"xy-tree-select__node--branch": K(n.node),
+					"xy-tree-select__node--checked": H(n.node),
+					"xy-tree-select__node--disabled": et(n.node),
+					"xy-tree-select__node--half-checked": U(n.node),
+					"xy-tree-select__node--selected": V.value.has(n.node.value),
+					"xy-tree-select__node--last": !Xe(n)
+				}, F.value.node]]),
+				role: "treeitem",
+				"aria-checked": f.treeCheckable ? U(n.node) ? "mixed" : H(n.node) : void 0,
+				"aria-disabled": et(n.node) || void 0,
+				"aria-expanded": K(n.node) ? q(n.node) : void 0,
+				"aria-level": n.depth + 1,
+				"aria-posinset": n.posInSet,
+				"aria-selected": f.treeCheckable ? void 0 : V.value.has(n.node.value),
+				"aria-setsize": n.setSize,
+				style: m(nt(n)),
+				tabindex: r === G.value ? 0 : -1,
+				onFocus: (e) => E.value = n.node.value,
+				onKeydown: (e) => wt(e, n, r),
+				onMouseenter: (e) => E.value = n.node.value
+			}, [
+				f.treeLine ? (h(), l("span", _e, [(h(!0), l(te, null, se(Ze(n), (e) => (h(), l("span", {
+					key: e,
+					class: "xy-tree-select__line-guide",
+					style: m({ insetInlineStart: `${e * 20 + 13}px` })
+				}, null, 4))), 128))])) : c("", !0),
+				K(n.node) ? (h(), l("button", {
+					key: 1,
+					type: "button",
+					class: p(["xy-tree-select__switcher", F.value.switcher]),
+					style: m(I.value.switcher),
+					"aria-label": y(C).treeSelect.toggleNodeAriaLabel(n.node.label),
+					tabindex: -1,
+					onClick: de((e) => St(n.node, r), ["stop"])
+				}, [_(e.$slots, "switcher", ae({ ref_for: !0 }, rt(n, r)), () => [$e(n.node) ? (h(), ne(a, {
+					key: 0,
+					name: "loading-outlined",
+					size: 11,
+					spin: ""
+				})) : (h(), ne(a, {
+					key: 1,
+					name: "right-outlined",
+					size: 11,
+					rotate: q(n.node) ? 90 : 0
+				}, null, 8, ["rotate"]))], !0)], 14, ve)) : (h(), l("span", ye)),
+				f.treeCheckable && n.node.checkable !== !1 ? (h(), ne(o, {
+					key: 3,
+					"aria-label": y(C).treeSelect.selectNodeAriaLabel(n.node.label),
+					"class-names": { root: F.value.checkbox },
+					disabled: J(n.node),
+					indeterminate: U(n.node),
+					"model-value": H(n.node),
+					styles: { root: I.value.checkbox },
+					tabindex: -1,
+					onClick: t[2] ||= de(() => {}, ["stop"]),
+					onChange: (e) => {
+						lt(n.node), $(r);
+					}
+				}, null, 8, [
+					"aria-label",
+					"class-names",
+					"disabled",
+					"indeterminate",
+					"model-value",
+					"styles",
+					"onChange"
+				])) : c("", !0),
+				u("button", {
+					type: "button",
+					class: p(["xy-tree-select__title", F.value.nodeContent]),
+					disabled: J(n.node),
+					style: m(I.value.nodeContent),
+					tabindex: "-1",
+					onClick: de((e) => {
+						ft(n.node), $(r);
+					}, ["stop"])
+				}, [_(e.$slots, "node", ae({ ref_for: !0 }, rt(n, r)), () => [re(v(n.node.label), 1)], !0)], 14, be)
+			], 46, ge))), 128)), W.value.length ? c("", !0) : (h(), l("div", {
+				key: 0,
+				class: p(["xy-tree-select__empty", F.value.empty]),
+				style: m(I.value.empty)
+			}, [_(e.$slots, "empty", {}, () => [re(v(Ne.value), 1)], !0)], 6))], 14, he))])]),
+			_: 3
+		}, 8, [
+			"allow-clear",
+			"aria-active-descendant",
+			"aria-label",
+			"autofocus",
+			"class-names",
+			"disabled",
+			"error",
+			"id",
+			"label",
+			"loading",
+			"max-count",
+			"max-tag-count",
+			"max-tag-text-length",
+			"model-value",
+			"multiple",
+			"open",
+			"options",
+			"placeholder",
+			"placement",
+			"popup-match-select-width",
+			"readonly",
+			"size",
+			"status",
+			"styles",
+			"variant"
+		])], 38));
+	}
+});
+//#endregion
+export { xe as default };