@veltra/desktop 1.0.0

package/dist/components/tree/tree-node.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree-node.js","names":[],"sources":["../../../src/components/tree/tree-node.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[cls.e('node'), bem.is('expanded', node.expanded), bem.is('disabled', node.disabled)]\"\n    :style=\"{ paddingLeft: withUnit(node.depth * 20 - 20, 'px') }\"\n    :ref=\"measureElement\"\n  >\n    <u-icon v-if=\"!node.isLeaf\" :class=\"cls.e('expand-icon')\" @click.stop=\"toggleExpand\">\n      <ArrowRight />\n    </u-icon>\n    <i v-else :class=\"cls.e('icon-placeholder')\"> </i>\n\n    <div\n      :class=\"cls.e('node-content')\"\n      @click=\"handleClick\"\n      @contextmenu=\"treeEmit('node-contextmenu', $event, node)\"\n      v-ripple=\"\n        (treeProps.checkable || treeProps.selectable) && !node.disabled ? cls.e('ripple') : false\n      \"\n    >\n      <u-checkbox\n        v-if=\"treeProps.checkable\"\n        :class=\"cls.e('checkbox')\"\n        :model-value=\"node.checked\"\n        :indeterminate=\"node.indeterminate\"\n        :disabled=\"node.disabled\"\n        @change=\"handleChange\"\n        @click.stop\n      />\n\n      <u-node-render :content=\"getTreeSlotsNode({ node, data: node.data })\" />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { vRipple } from '@veltra/directives'\nimport { ArrowRight } from '@veltra/icons/normal'\nimport { bem, withUnit } from '@veltra/utils'\nimport { inject } from 'vue'\n\nimport type { TreeNodeProps } from '../../types'\nimport UCheckbox from '../checkbox/checkbox.vue'\nimport { UIcon } from '../icon'\nimport { UNodeRender } from '../node-render'\nimport { TreeDIKey } from './di'\n\ndefineOptions({\n  name: 'TreeNode'\n})\n\nconst props = defineProps<TreeNodeProps>()\n\nconst { treeProps, treeEmit, cls, getTreeSlotsNode, getFlattedNodes, toggleCheck, handleSelect } =\n  inject(TreeDIKey)!\n\nfunction toggleExpand() {\n  const { node } = props\n  node.expanded = !node.expanded\n  getFlattedNodes()\n\n  treeEmit('expand', node)\n}\n\nfunction handleChange(checked: boolean, e: MouseEvent) {\n  toggleCheck(props.node, checked, e.ctrlKey)\n}\n\nfunction handleClick(e: MouseEvent) {\n  const { node } = props\n  treeEmit('node-click', node)\n\n  treeProps.selectable && handleSelect(node)\n  treeProps.expandOnClickNode && toggleExpand()\n  treeProps.checkable &&\n    !node.disabled &&\n    !treeProps.expandOnClickNode &&\n    toggleCheck(node, !node.checked, e.ctrlKey)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;EAkDA,MAAM,QAAQ;EAEd,MAAM,EAAE,WAAW,UAAU,KAAK,kBAAkB,iBAAiB,aAAa,iBAChF,OAAO,UAAU;EAEnB,SAAS,eAAe;GACtB,MAAM,EAAE,SAAS;AACjB,QAAK,WAAW,CAAC,KAAK;AACtB,oBAAgB;AAEhB,YAAS,UAAU,KAAI;;EAGzB,SAAS,aAAa,SAAkB,GAAe;AACrD,eAAY,MAAM,MAAM,SAAS,EAAE,QAAO;;EAG5C,SAAS,YAAY,GAAe;GAClC,MAAM,EAAE,SAAS;AACjB,YAAS,cAAc,KAAI;AAE3B,aAAU,cAAc,aAAa,KAAI;AACzC,aAAU,qBAAqB,cAAa;AAC5C,aAAU,aACR,CAAC,KAAK,YACN,CAAC,UAAU,qBACX,YAAY,MAAM,CAAC,KAAK,SAAS,EAAE,QAAO;;;uBA3E5C,mBA8BM,OAAA;IA7BH,OAAK,eAAA;KAAG,MAAA,IAAG,CAAC,EAAC,OAAA;KAAU,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,KAAK,SAAQ;KAAG,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,KAAK,SAAQ;KAAA,CAAA;IAC1F,OAAK,eAAA,EAAA,aAAiB,MAAA,SAAQ,CAAC,QAAA,KAAK,QAAK,KAAA,IAAA,KAAA,EAAA,CAAA;IACzC,KAAK,QAAA;QAES,QAAA,KAAK,UAAA,WAAA,EAApB,YAES,MAAA,YAAA,EAAA;;IAFoB,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,cAAA,CAAA;IAAkB,SAAK,cAAO,cAAY,CAAA,OAAA,CAAA;;2BACnE,CAAd,YAAc,MAAA,WAAA,CAAA,CAAA,CAAA;;qCAEhB,mBAAkD,KAAA;;IAAvC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,mBAAA,CAAA;8CAEvB,mBAmBM,OAAA;IAlBH,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,eAAA,CAAA;IACZ,SAAO;IACP,eAAW,OAAA,OAAA,OAAA,MAAA,WAAE,MAAA,SAAQ,CAAA,oBAAqB,QAAQ,QAAA,KAAI;OAM/C,MAAA,UAAS,CAAC,aAAA,WAAA,EADlB,YAQE,aAAA;;IANC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,WAAA,CAAA;IACZ,eAAa,QAAA,KAAK;IAClB,eAAe,QAAA,KAAK;IACpB,UAAU,QAAA,KAAK;IACf,UAAQ;IACR,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;;;;;;2CAGb,YAAwE,MAAA,WAAA,EAAA,EAAxD,SAAS,MAAA,iBAAgB,CAAA;IAAA,MAAG,QAAA;IAAI,MAAQ,QAAA,KAAK;IAAI,CAAA,EAAA,EAAA,MAAA,GAAA,CAAA,UAAA,CAAA,CAAA,EAAA,GAAA,GAAA,CAAA,CAAA,MAAA,QAAA,GAd7C,MAAA,UAAS,CAAC,aAAa,MAAA,UAAS,CAAC,eAAU,CAAM,QAAA,KAAK,WAAW,MAAA,IAAG,CAAC,EAAC,SAAA,GAAA,MAAA,CAAA,CAAA,CAAA,EAAA,EAAA"}

package/dist/components/tree/tree-node2.js

@@ -0,0 +1,44 @@
+import { shallowReactive } from "vue";
+import { TreeNode, o } from "@cat-kit/core";
+//#region src/components/tree/tree-node.ts
+var TreeNode$1 = class extends TreeNode {
+	expanded = false;
+	loading = false;
+	loaded = false;
+	/** 多选是否选中 */
+	checked = false;
+	disabled = false;
+	visible = true;
+	/** 子节点选中数量 */
+	childrenCheckCount = 0;
+	get indeterminate() {
+		if (!this.children) return false;
+		return this.childrenCheckCount > 0;
+	}
+	labelKey;
+	valueKey;
+	constructor(params) {
+		const { data, index, depth, parent, labelKey, valueKey } = params;
+		super(data, index, depth, parent);
+		this.labelKey = labelKey;
+		this.valueKey = valueKey;
+		return shallowReactive(this);
+	}
+	get label() {
+		return String(o(this.data).get(this.labelKey));
+	}
+	get key() {
+		return o(this.data).get(this.valueKey);
+	}
+	/**
+	* 向上冒泡设置
+	* @param setter 设置函数, 返回 false 则停止冒泡
+	*/
+	bubbleSet(setter) {
+		setter(this) !== false && this.parent?.bubbleSet(setter);
+	}
+};
+//#endregion
+export { TreeNode$1 as TreeNode };
+
+//# sourceMappingURL=tree-node2.js.map

package/dist/components/tree/tree-node2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree-node2.js","names":["TreeNode","CoreTreeNode"],"sources":["../../../src/components/tree/tree-node.ts"],"sourcesContent":["import { TreeNode as CoreTreeNode, o } from '@cat-kit/core'\nimport { shallowReactive } from 'vue'\n\nexport class TreeNode<Val extends Record<string, any> = Record<string, any>> extends CoreTreeNode<\n  Val,\n  TreeNode<Val>\n> {\n  declare parent?: TreeNode<Val>\n\n  declare children?: TreeNode<Val>[]\n\n  expanded = false\n  loading = false\n  loaded = false\n  /** 多选是否选中 */\n  checked = false\n  disabled = false\n  visible = true\n  /** 子节点选中数量 */\n  childrenCheckCount = 0\n\n  get indeterminate(): boolean {\n    if (!this.children) return false\n    return (\n      this.childrenCheckCount > 0\n      // && this.childrenCheckCount < this.children.length\n    )\n  }\n\n  labelKey: string\n  valueKey: string\n\n  constructor(params: {\n    data: Val\n    index: number\n    depth: number\n    parent?: TreeNode<Val>\n    labelKey: string\n    valueKey: string\n  }) {\n    const { data, index, depth, parent, labelKey, valueKey } = params\n    super(data, index, depth, parent)\n    this.labelKey = labelKey\n    this.valueKey = valueKey\n\n    return shallowReactive(this)\n  }\n\n  get label(): string {\n    return String(o(this.data).get(this.labelKey))\n  }\n\n  get key(): string | number {\n    return o(this.data).get(this.valueKey) as string | number\n  }\n\n  /**\n   * 向上冒泡设置\n   * @param setter 设置函数, 返回 false 则停止冒泡\n   */\n  bubbleSet(setter: (node: TreeNode<Val>) => boolean | void): void {\n    const ret = setter(this)\n    ret !== false && this.parent?.bubbleSet(setter)\n  }\n}\n"],"mappings":";;;AAGA,IAAaA,aAAb,cAAqFC,SAGnF;CAKA,WAAW;CACX,UAAU;CACV,SAAS;;CAET,UAAU;CACV,WAAW;CACX,UAAU;;CAEV,qBAAqB;CAErB,IAAI,gBAAyB;AAC3B,MAAI,CAAC,KAAK,SAAU,QAAO;AAC3B,SACE,KAAK,qBAAqB;;CAK9B;CACA;CAEA,YAAY,QAOT;EACD,MAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,UAAU,aAAa;AAC3D,QAAM,MAAM,OAAO,OAAO,OAAO;AACjC,OAAK,WAAW;AAChB,OAAK,WAAW;AAEhB,SAAO,gBAAgB,KAAK;;CAG9B,IAAI,QAAgB;AAClB,SAAO,OAAO,EAAE,KAAK,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC;;CAGhD,IAAI,MAAuB;AACzB,SAAO,EAAE,KAAK,KAAK,CAAC,IAAI,KAAK,SAAS;;;;;;CAOxC,UAAU,QAAuD;AACnD,SAAO,KAAK,KAChB,SAAS,KAAK,QAAQ,UAAU,OAAO"}

package/dist/components/tree/tree.js

@@ -0,0 +1,219 @@
+import _sfc_main$1 from "../scroll/scroll.js";
+import _sfc_main$2 from "../empty/empty.js";
+import { TreeDIKey } from "./di.js";
+import _sfc_main$3 from "./tree-node.js";
+import { useCheck } from "./use-check.js";
+import { useFilter } from "./use-filter.js";
+import { useSelect } from "./use-select.js";
+import { useTreeNodes } from "./use-tree-nodes.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, provide, renderList, shallowRef, unref, useSlots, watch, watchEffect, withCtx } from "vue";
+import { bem, nextFrame, scrollIntoContainerView, withUnit } from "@veltra/utils";
+import { useFormComponent, useFormFallbackProps, useVirtual } from "@veltra/compositions";
+//#region src/components/tree/tree.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "Tree",
+	__name: "tree",
+	props: {
+		expandAll: { type: Boolean },
+		expandOnClickNode: {
+			type: Boolean,
+			default: false
+		},
+		labelKey: { default: "label" },
+		valueKey: { default: "value" },
+		childrenKey: { default: "children" },
+		data: { default: () => [] },
+		disabledNode: {},
+		checkable: { type: Boolean },
+		selectable: { type: Boolean },
+		checkStrictly: {
+			type: Boolean,
+			default: false
+		},
+		selected: {},
+		checked: {},
+		slots: {},
+		scrollToView: { type: Boolean }
+	},
+	emits: [
+		"expand",
+		"node-click",
+		"update:selected",
+		"update:checked",
+		"node-contextmenu",
+		"selected-synced"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("tree");
+		const { formProps } = useFormComponent();
+		const { size } = useFormFallbackProps([formProps ?? {}, props], { size: "default" });
+		const scrollRef = shallowRef();
+		const className = computed(() => {
+			return [
+				cls.b,
+				cls.m(size.value),
+				bem.is("selectable", props.selectable),
+				bem.is("checkable", props.checkable)
+			];
+		});
+		const slots = useSlots();
+		function getTreeSlotsNode(ctx) {
+			return (props.slots?.default ?? slots.default)?.(ctx) ?? ctx.node.label;
+		}
+		const { nodes, forest, getFlattedNodes, nodeDict } = useTreeNodes({ props });
+		watch([
+			() => props.selectable,
+			() => props.checkable,
+			forest
+		], ([s, c]) => {
+			if (s || c) return;
+			getFlattedNodes();
+		}, { immediate: true });
+		const { filter } = useFilter({
+			forest,
+			getFlattedNodes
+		});
+		const { handleSelect, selectedData } = useSelect({
+			props,
+			emit,
+			nodeDict,
+			getFlattedNodes
+		});
+		const { checkedData, toggleCheck } = useCheck({
+			props,
+			emit,
+			nodeDict,
+			getFlattedNodes
+		});
+		const { totalHeight, virtualList, scrollTo, virtualEnabled, measureElement } = useVirtual({
+			count: computed(() => nodes.value.length),
+			estimateSize: () => 40,
+			gap: 2,
+			virtualThreshold: 80,
+			scrollEl: computed(() => scrollRef.value?.containerRef ?? null)
+		});
+		const virtualNodes = computed(() => {
+			const _nodes = nodes.value;
+			return virtualList.value.map((item) => {
+				const node = _nodes[item.index];
+				return {
+					node,
+					key: node.key || item.key,
+					offset: item.start,
+					index: item.index
+				};
+			});
+		});
+		function scrollIntoView() {
+			const { selectable, checkable, scrollToView } = props;
+			if (!scrollToView || !selectable && !checkable || !nodes.value) return;
+			let index = -1;
+			if (selectable) {
+				if (!selectedData.value) return;
+				index = nodes.value.findIndex((node) => node.data === selectedData.value);
+			} else if (checkable) {
+				if (!checkedData.size) return;
+				index = nodes.value.findIndex((node) => checkedData.has(node.data));
+			}
+			if (virtualEnabled.value) scrollTo(index);
+			else {
+				const { contentRef, containerRef } = scrollRef.value ?? {};
+				const el = contentRef?.children[index];
+				el && scrollIntoContainerView(el, containerRef ?? null);
+			}
+		}
+		watchEffect(() => {
+			nextFrame(() => {
+				scrollIntoView();
+			});
+		});
+		provide(TreeDIKey, {
+			cls,
+			selectedData,
+			checkedData,
+			getFlattedNodes,
+			getTreeSlotsNode,
+			treeEmit: emit,
+			treeProps: props,
+			toggleCheck,
+			handleSelect
+		});
+		__expose({
+			filter,
+			forest,
+			nodes,
+			checkNode: toggleCheck,
+			selectNode: handleSelect,
+			checkAll(check) {
+				forest.value.roots.forEach((node) => {
+					toggleCheck(node, check);
+				});
+			},
+			getSelected() {
+				return selectedData;
+			},
+			getChecked() {
+				return Array.from(checkedData);
+			},
+			scrollTo,
+			expandAll() {
+				forest.value.dfs((node) => {
+					node.expanded = true;
+				});
+				getFlattedNodes();
+			},
+			collapseAll() {
+				forest.value.dfs((node) => {
+					node.expanded = false;
+				});
+				getFlattedNodes();
+			}
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(_sfc_main$1), {
+				class: normalizeClass(className.value),
+				ref_key: "scrollRef",
+				ref: scrollRef,
+				"content-style": { height: unref(virtualEnabled) ? unref(withUnit)(unref(totalHeight), "px") : void 0 },
+				"content-class": [unref(cls).e("wrap"), unref(bem).is("virtual", unref(virtualEnabled))]
+			}, {
+				default: withCtx(() => [unref(virtualEnabled) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(virtualNodes.value, ({ node, key, offset, index }) => {
+					return openBlock(), createBlock(_sfc_main$3, {
+						node,
+						key,
+						class: normalizeClass(unref(bem).is("selected", node.data === unref(selectedData))),
+						"data-index": index,
+						"measure-element": unref(measureElement),
+						style: normalizeStyle({ transform: `translateY(${offset}px)` })
+					}, null, 8, [
+						"node",
+						"class",
+						"data-index",
+						"measure-element",
+						"style"
+					]);
+				}), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(unref(nodes), (node) => {
+					return openBlock(), createBlock(_sfc_main$3, {
+						node,
+						key: node.key,
+						class: normalizeClass(unref(bem).is("selected", node.data === unref(selectedData)))
+					}, null, 8, ["node", "class"]);
+				}), 128)), !unref(nodes).length ? (openBlock(), createElementBlock("div", {
+					key: 2,
+					class: normalizeClass(unref(cls).e("empty"))
+				}, [createVNode(unref(_sfc_main$2))], 2)) : createCommentVNode("v-if", true)]),
+				_: 1
+			}, 8, [
+				"class",
+				"content-style",
+				"content-class"
+			]);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=tree.js.map

package/dist/components/tree/tree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree.js","names":[],"sources":["../../../src/components/tree/tree.vue"],"sourcesContent":["<template>\n  <u-scroll\n    :class=\"className\"\n    ref=\"scrollRef\"\n    :content-style=\"{ height: virtualEnabled ? withUnit(totalHeight, 'px') : undefined }\"\n    :content-class=\"[cls.e('wrap'), bem.is('virtual', virtualEnabled)]\"\n  >\n    <template v-if=\"virtualEnabled\">\n      <UTreeNode\n        v-for=\"{ node, key, offset, index } of virtualNodes\"\n        :node=\"node\"\n        :key=\"key\"\n        :class=\"bem.is('selected', node.data === selectedData)\"\n        :data-index=\"index\"\n        :measure-element=\"measureElement\"\n        :style=\"{ transform: `translateY(${offset}px)` }\"\n      />\n    </template>\n    <template v-else>\n      <UTreeNode\n        v-for=\"node of nodes\"\n        :node=\"node\"\n        :key=\"node.key\"\n        :class=\"bem.is('selected', node.data === selectedData)\"\n      />\n    </template>\n\n    <div :class=\"cls.e('empty')\" v-if=\"!nodes.length\">\n      <UEmpty />\n    </div>\n  </u-scroll>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormComponent, useFormFallbackProps } from '@veltra/compositions'\nimport { useVirtual } from '@veltra/compositions'\nimport { bem, nextFrame, withUnit, scrollIntoContainerView } from '@veltra/utils'\nimport { computed, provide, shallowRef, useSlots, watch, watchEffect, type VNode } from 'vue'\n\nimport type { TreeProps, TreeEmit, _TreeExposed } from '../../types'\nimport type { ScrollExposed } from '../../types'\nimport { UEmpty } from '../empty'\nimport { UScroll } from '../scroll'\nimport { TreeDIKey, type TreeConText, type TreeSlotsScope } from './di'\nimport UTreeNode from './tree-node.vue'\nimport { useCheck } from './use-check'\nimport { useFilter } from './use-filter'\nimport { useSelect } from './use-select'\nimport { useTreeNodes } from './use-tree-nodes'\n\ndefineOptions({\n  name: 'Tree'\n})\n\nconst props = withDefaults(defineProps<TreeProps>(), {\n  labelKey: 'label',\n  valueKey: 'value',\n  childrenKey: 'children',\n  expandOnClickNode: false,\n  checkStrictly: false,\n  data: () => []\n})\n\nconst emit = defineEmits<TreeEmit>()\n\nconst cls = bem('tree')\n\nconst { formProps } = useFormComponent()\n\nconst { size } = useFormFallbackProps([formProps ?? {}, props], {\n  size: 'default'\n})\n\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst className = computed(() => {\n  return [\n    cls.b,\n    cls.m(size.value),\n    bem.is('selectable', props.selectable),\n    bem.is('checkable', props.checkable)\n  ]\n})\n\ndefineSlots<{\n  default: (props: TreeSlotsScope) => any\n}>()\n\nconst slots = useSlots()\n\nfunction getTreeSlotsNode(ctx: TreeSlotsScope): VNode[] | string | undefined {\n  return (props.slots?.default ?? slots.default)?.(ctx) ?? ctx.node.label\n}\n\nconst { nodes, forest, getFlattedNodes, nodeDict } = useTreeNodes({\n  props\n})\n\nwatch(\n  [() => props.selectable, () => props.checkable, forest],\n  ([s, c]) => {\n    // 如果选择或勾选，则不更新节点\n    if (s || c) return\n    getFlattedNodes()\n  },\n  { immediate: true }\n)\n\nconst { filter } = useFilter({ forest, getFlattedNodes })\n\nconst { handleSelect, selectedData } = useSelect({\n  props,\n  emit,\n  nodeDict,\n  getFlattedNodes\n})\n\nconst { checkedData, toggleCheck } = useCheck({\n  props,\n  emit,\n  nodeDict,\n  getFlattedNodes\n})\n\nconst { totalHeight, virtualList, scrollTo, virtualEnabled, measureElement } = useVirtual({\n  count: computed(() => nodes.value.length),\n  estimateSize: () => 40,\n  gap: 2,\n  virtualThreshold: 80,\n  scrollEl: computed(() => scrollRef.value?.containerRef ?? null)\n})\n\nconst virtualNodes = computed(() => {\n  const _nodes = nodes.value\n\n  return virtualList.value.map((item) => {\n    const node = _nodes[item.index]!\n    return {\n      node,\n      key: node.key || item.key,\n      offset: item.start,\n      index: item.index\n    }\n  })\n})\n\nfunction scrollIntoView() {\n  const { selectable, checkable, scrollToView } = props\n  if (!scrollToView || (!selectable && !checkable) || !nodes.value) return\n  let index = -1\n\n  if (selectable) {\n    if (!selectedData.value) return\n    index = nodes.value.findIndex((node) => node.data === selectedData.value)\n  } else if (checkable) {\n    if (!checkedData.size) return\n    index = nodes.value.findIndex((node) => checkedData.has(node.data))\n  }\n\n  if (virtualEnabled.value) {\n    scrollTo(index)\n  } else {\n    const { contentRef, containerRef } = scrollRef.value ?? {}\n    const el = contentRef?.children[index]\n    el && scrollIntoContainerView(el as HTMLElement, containerRef ?? null)\n  }\n}\n\nwatchEffect(() => {\n  nextFrame(() => {\n    scrollIntoView()\n  })\n})\n\nprovide(TreeDIKey, {\n  cls,\n  selectedData,\n  checkedData,\n  getFlattedNodes,\n  getTreeSlotsNode,\n  treeEmit: emit as TreeEmit,\n  treeProps: props as TreeProps,\n  toggleCheck: toggleCheck as TreeConText['toggleCheck'],\n  handleSelect: handleSelect as TreeConText['handleSelect']\n})\n\ndefineExpose<_TreeExposed>({\n  filter,\n  forest,\n  nodes,\n  checkNode: toggleCheck,\n  selectNode: handleSelect,\n  checkAll(check: boolean) {\n    forest.value.roots.forEach((node) => {\n      toggleCheck(node, check)\n    })\n  },\n  getSelected() {\n    return selectedData\n  },\n  getChecked() {\n    return Array.from(checkedData)\n  },\n  scrollTo,\n\n  expandAll() {\n    forest.value.dfs((node) => {\n      node.expanded = true\n    })\n    getFlattedNodes()\n  },\n  collapseAll() {\n    forest.value.dfs((node) => {\n      node.expanded = false\n    })\n    getFlattedNodes()\n  }\n})\n</script>\n"],"mappings":"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"}

package/dist/components/tree/tree.vue.d.ts

@@ -0,0 +1,40 @@
+import { TreeNode, TreeProps, _TreeExposed } from "../../types/tree.js";
+import { TreeSlotsScope } from "./di.js";
+import * as _$vue from "vue";
+
+//#region src/components/tree/tree.vue.d.ts
+type __VLS_Slots = {
+  default: (props: TreeSlotsScope) => any;
+};
+declare const __VLS_base: _$vue.DefineComponent<TreeProps, _TreeExposed, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {} & {
+  "update:checked": (checked: any[], checkedData: Record<string, any>[]) => any;
+  "update:selected": (selected?: any, selectedData?: Record<string, any> | undefined, node?: TreeNode<Record<string, any>> | undefined) => any;
+  expand: (node: TreeNode<Record<string, any>>) => any;
+  "node-click": (node: TreeNode<Record<string, any>>) => any;
+  "node-contextmenu": (event: MouseEvent, node: TreeNode<Record<string, any>>) => any;
+  "selected-synced": (selected?: Record<string, any> | undefined) => any;
+}, string, _$vue.PublicProps, Readonly<TreeProps> & Readonly<{
+  "onUpdate:checked"?: ((checked: any[], checkedData: Record<string, any>[]) => any) | undefined;
+  "onUpdate:selected"?: ((selected?: any, selectedData?: Record<string, any> | undefined, node?: TreeNode<Record<string, any>> | undefined) => any) | undefined;
+  onExpand?: ((node: TreeNode<Record<string, any>>) => any) | undefined;
+  "onNode-click"?: ((node: TreeNode<Record<string, any>>) => any) | undefined;
+  "onNode-contextmenu"?: ((event: MouseEvent, node: TreeNode<Record<string, any>>) => any) | undefined;
+  "onSelected-synced"?: ((selected?: Record<string, any> | undefined) => any) | undefined;
+}>, {
+  data: Record<string, any>[];
+  labelKey: string;
+  valueKey: string;
+  expandOnClickNode: boolean;
+  childrenKey: string;
+  checkStrictly: boolean;
+}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+type __VLS_WithSlots<T, S> = T & {
+  new (): {
+    $slots: S;
+  };
+};
+//#endregion
+export { _default };
+//# sourceMappingURL=tree.vue.d.ts.map

package/dist/components/tree/use-check.js

@@ -0,0 +1,80 @@
+import { nextTick, watch } from "vue";
+import { dfs, o } from "@cat-kit/core";
+//#region src/components/tree/use-check.ts
+function useCheck(options) {
+	const { emit, props, nodeDict, getFlattedNodes } = options;
+	const checkedData = /* @__PURE__ */ new Set();
+	function checkNode(node) {
+		node.checked = true;
+		if (node.parent) node.parent.childrenCheckCount++;
+		checkedData.add(node.data);
+	}
+	function uncheckNode(node) {
+		node.checked = false;
+		if (node.parent) node.parent.childrenCheckCount--;
+		checkedData.delete(node.data);
+	}
+	/**
+	* 模型值是否由事件触发
+	*/
+	let checkedByEvent = false;
+	watch([() => props.checked, nodeDict], ([c, nodeDict]) => {
+		if (checkedByEvent || !props.checkable) return;
+		if (!nodeDict.size) return;
+		checkedData.clear();
+		c?.forEach((v) => {
+			const node = nodeDict.get(v);
+			if (node) {
+				checkNode(node);
+				node.bubbleSet((node) => {
+					if (node.parent) {
+						if (node.parent.expanded) return false;
+						node.parent.expanded = true;
+					}
+				});
+			}
+		});
+		getFlattedNodes();
+	}, { immediate: true });
+	function handleCheck(node, ctrlKey) {
+		const { checkStrictly } = props;
+		if (ctrlKey) checkNode(node);
+		else dfs(node, (n) => {
+			const tn = n;
+			!tn.disabled && checkNode(tn);
+		}, props.childrenKey ?? "children");
+		if (!checkStrictly) node.bubbleSet((node) => {
+			const { parent } = node;
+			if (parent) parent.childrenCheckCount === parent.children.length ? checkNode(parent) : uncheckNode(parent);
+		});
+	}
+	function handleUncheck(node, ctrlKey) {
+		const { checkStrictly } = props;
+		if (ctrlKey) uncheckNode(node);
+		else dfs(node, (n) => {
+			const tn = n;
+			!tn.disabled && uncheckNode(tn);
+		}, props.childrenKey ?? "children");
+		if (!checkStrictly) node.bubbleSet((node) => {
+			const { parent } = node;
+			if (parent) uncheckNode(parent);
+		});
+	}
+	function toggleCheck(node, check, ctrlKey) {
+		checkedByEvent = true;
+		check ? handleCheck(node, ctrlKey) : handleUncheck(node, ctrlKey);
+		const checkedArr = Array.from(checkedData);
+		emit("update:checked", checkedArr.map((item) => o(item).get(props.valueKey)), checkedArr);
+		nextTick(() => {
+			checkedByEvent = false;
+		});
+	}
+	return {
+		checkedData,
+		toggleCheck
+	};
+}
+//#endregion
+export { useCheck };
+
+//# sourceMappingURL=use-check.js.map

package/dist/components/tree/use-check.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-check.js","names":[],"sources":["../../../src/components/tree/use-check.ts"],"sourcesContent":["import { dfs, o } from '@cat-kit/core'\nimport { nextTick, watch, type ComputedRef } from 'vue'\n\nimport type { TreeEmit, TreeProps } from '../../types'\nimport type { TreeNode } from './tree-node'\n\ninterface Options {\n  emit: TreeEmit\n  props: TreeProps\n  nodeDict: ComputedRef<Map<any, TreeNode>>\n  getFlattedNodes: () => void\n}\n\ninterface UseCheckReturned {\n  checkedData: Set<Record<string, any>>\n  toggleCheck: (node: TreeNode, check: boolean, ctrlKey?: boolean) => void\n}\n\nexport function useCheck(options: Options): UseCheckReturned {\n  const { emit, props, nodeDict, getFlattedNodes } = options\n\n  const checkedData = new Set<Record<string, any>>()\n\n  function checkNode(node: TreeNode) {\n    node.checked = true\n    if (node.parent) {\n      node.parent.childrenCheckCount++\n    }\n    checkedData.add(node.data)\n  }\n\n  function uncheckNode(node: TreeNode) {\n    node.checked = false\n    if (node.parent) {\n      node.parent.childrenCheckCount--\n    }\n    checkedData.delete(node.data)\n  }\n\n  /**\n   * 模型值是否由事件触发\n   */\n  let checkedByEvent = false\n\n  // 回显\n  watch(\n    [() => props.checked, nodeDict],\n    ([c, nodeDict]) => {\n      // 事件已经触发模型变更了，所以不再进行下面的计算\n      if (checkedByEvent || !props.checkable) return\n\n      if (!nodeDict.size) return\n      checkedData.clear()\n\n      c?.forEach((v) => {\n        const node = nodeDict.get(v)\n        if (node) {\n          checkNode(node)\n          node.bubbleSet((node) => {\n            if (node.parent) {\n              if (node.parent.expanded) return false\n              node.parent.expanded = true\n            }\n          })\n        }\n      })\n\n      getFlattedNodes()\n    },\n    { immediate: true }\n  )\n\n  function handleCheck(node: TreeNode, ctrlKey?: boolean) {\n    const { checkStrictly } = props\n\n    if (ctrlKey) {\n      checkNode(node)\n    } else {\n      dfs(\n        node as unknown as Record<string, unknown>,\n        (n) => {\n          const tn = n as unknown as TreeNode\n          !tn.disabled && checkNode(tn)\n        },\n        props.childrenKey ?? 'children'\n      )\n    }\n\n    // 非严格选择时还需要更新祖先节点，\n    // 一旦子节点全部选中，父节点也要设置为选中状态\n    if (!checkStrictly) {\n      node.bubbleSet((node) => {\n        const { parent } = node\n\n        if (parent) {\n          const parentChecked = parent.childrenCheckCount === parent.children!.length\n\n          parentChecked ? checkNode(parent) : uncheckNode(parent)\n        }\n      })\n    }\n  }\n\n  function handleUncheck(node: TreeNode, ctrlKey?: boolean) {\n    const { checkStrictly } = props\n    if (ctrlKey) {\n      uncheckNode(node)\n    } else {\n      dfs(\n        node as unknown as Record<string, unknown>,\n        (n) => {\n          const tn = n as unknown as TreeNode\n          !tn.disabled && uncheckNode(tn)\n        },\n        props.childrenKey ?? 'children'\n      )\n    }\n\n    // 非严格模式下，取消选中时，需要更新父节点\n    if (!checkStrictly) {\n      node.bubbleSet((node) => {\n        const { parent } = node\n        if (parent) {\n          uncheckNode(parent)\n        }\n      })\n    }\n  }\n\n  function toggleCheck(node: TreeNode, check: boolean, ctrlKey?: boolean) {\n    checkedByEvent = true\n\n    check ? handleCheck(node, ctrlKey) : handleUncheck(node, ctrlKey)\n\n    const checkedArr = Array.from(checkedData)\n\n    emit(\n      'update:checked',\n      checkedArr.map((item) => o(item).get(props.valueKey!)),\n      checkedArr\n    )\n\n    nextTick(() => {\n      checkedByEvent = false\n    })\n  }\n\n  return { checkedData, toggleCheck }\n}\n"],"mappings":";;;AAkBA,SAAgB,SAAS,SAAoC;CAC3D,MAAM,EAAE,MAAM,OAAO,UAAU,oBAAoB;CAEnD,MAAM,8BAAc,IAAI,KAA0B;CAElD,SAAS,UAAU,MAAgB;AACjC,OAAK,UAAU;AACf,MAAI,KAAK,OACP,MAAK,OAAO;AAEd,cAAY,IAAI,KAAK,KAAK;;CAG5B,SAAS,YAAY,MAAgB;AACnC,OAAK,UAAU;AACf,MAAI,KAAK,OACP,MAAK,OAAO;AAEd,cAAY,OAAO,KAAK,KAAK;;;;;CAM/B,IAAI,iBAAiB;AAGrB,OACE,OAAO,MAAM,SAAS,SAAS,GAC9B,CAAC,GAAG,cAAc;AAEjB,MAAI,kBAAkB,CAAC,MAAM,UAAW;AAExC,MAAI,CAAC,SAAS,KAAM;AACpB,cAAY,OAAO;AAEnB,KAAG,SAAS,MAAM;GAChB,MAAM,OAAO,SAAS,IAAI,EAAE;AAC5B,OAAI,MAAM;AACR,cAAU,KAAK;AACf,SAAK,WAAW,SAAS;AACvB,SAAI,KAAK,QAAQ;AACf,UAAI,KAAK,OAAO,SAAU,QAAO;AACjC,WAAK,OAAO,WAAW;;MAEzB;;IAEJ;AAEF,mBAAiB;IAEnB,EAAE,WAAW,MAAM,CACpB;CAED,SAAS,YAAY,MAAgB,SAAmB;EACtD,MAAM,EAAE,kBAAkB;AAE1B,MAAI,QACF,WAAU,KAAK;MAEf,KACE,OACC,MAAM;GACL,MAAM,KAAK;AACX,IAAC,GAAG,YAAY,UAAU,GAAG;KAE/B,MAAM,eAAe,WACtB;AAKH,MAAI,CAAC,cACH,MAAK,WAAW,SAAS;GACvB,MAAM,EAAE,WAAW;AAEnB,OAAI,OACoB,QAAO,uBAAuB,OAAO,SAAU,SAErD,UAAU,OAAO,GAAG,YAAY,OAAO;IAEzD;;CAIN,SAAS,cAAc,MAAgB,SAAmB;EACxD,MAAM,EAAE,kBAAkB;AAC1B,MAAI,QACF,aAAY,KAAK;MAEjB,KACE,OACC,MAAM;GACL,MAAM,KAAK;AACX,IAAC,GAAG,YAAY,YAAY,GAAG;KAEjC,MAAM,eAAe,WACtB;AAIH,MAAI,CAAC,cACH,MAAK,WAAW,SAAS;GACvB,MAAM,EAAE,WAAW;AACnB,OAAI,OACF,aAAY,OAAO;IAErB;;CAIN,SAAS,YAAY,MAAgB,OAAgB,SAAmB;AACtE,mBAAiB;AAEjB,UAAQ,YAAY,MAAM,QAAQ,GAAG,cAAc,MAAM,QAAQ;EAEjE,MAAM,aAAa,MAAM,KAAK,YAAY;AAE1C,OACE,kBACA,WAAW,KAAK,SAAS,EAAE,KAAK,CAAC,IAAI,MAAM,SAAU,CAAC,EACtD,WACD;AAED,iBAAe;AACb,oBAAiB;IACjB;;AAGJ,QAAO;EAAE;EAAa;EAAa"}

package/dist/components/tree/use-filter.js

@@ -0,0 +1,45 @@
+//#region src/components/tree/use-filter.ts
+function useFilter(options) {
+	const { forest, getFlattedNodes } = options;
+	/**
+	* 追踪缓存
+	* @description
+	* 在每一次过滤时，对每个节点的所有祖先节点进行展开，
+	* 但这样的代价是巨大的，时间成本为O(nlog(n)). 因此使用一个追踪缓存来减少追踪的次数,
+	* 该缓存堆入节点的父节点，如果该父节点已经被堆入则不再进行堆入
+	*/
+	const traceCache = /* @__PURE__ */ new Set();
+	function defaultFilter(node, qs) {
+		if (!qs) return true;
+		return node.label.includes(qs);
+	}
+	/**
+	* 显示回溯
+	* @param node 节点
+	*/
+	function trace(node) {
+		node.visible = true;
+		let parent = node.parent;
+		while (parent && !traceCache.has(parent)) {
+			traceCache.add(parent);
+			parent.expanded = true;
+			parent.visible = true;
+			parent = parent.parent;
+		}
+		if (!node.isLeaf) traceCache.add(node);
+	}
+	function filter(filterMethod) {
+		traceCache.clear();
+		const filterFn = typeof filterMethod === "string" ? (node) => defaultFilter(node, filterMethod) : filterMethod;
+		forest.value.dfs((node) => {
+			if (filterFn(node)) trace(node);
+			else node.visible = false;
+		});
+		getFlattedNodes();
+	}
+	return { filter };
+}
+//#endregion
+export { useFilter };
+
+//# sourceMappingURL=use-filter.js.map

package/dist/components/tree/use-filter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-filter.js","names":[],"sources":["../../../src/components/tree/use-filter.ts"],"sourcesContent":["import type { Forest } from '@cat-kit/core'\nimport type { ShallowRef } from 'vue'\n\nimport type { TreeNode } from './tree-node'\n\ninterface Options {\n  forest: ShallowRef<Forest<Record<string, unknown>, any>>\n  getFlattedNodes: () => void\n}\n\ninterface UseFilterReturned {\n  filter: (filterMethod: string | ((node: TreeNode) => boolean)) => void\n}\n\nexport function useFilter(options: Options): UseFilterReturned {\n  const { forest, getFlattedNodes } = options\n\n  /**\n   * 追踪缓存\n   * @description\n   * 在每一次过滤时，对每个节点的所有祖先节点进行展开，\n   * 但这样的代价是巨大的，时间成本为O(nlog(n)). 因此使用一个追踪缓存来减少追踪的次数,\n   * 该缓存堆入节点的父节点，如果该父节点已经被堆入则不再进行堆入\n   */\n  const traceCache = new Set<TreeNode>()\n\n  function defaultFilter(node: TreeNode, qs: string) {\n    if (!qs) return true\n    return node.label.includes(qs)\n  }\n\n  /**\n   * 显示回溯\n   * @param node 节点\n   */\n  function trace(node: TreeNode) {\n    node.visible = true\n    let parent = node.parent\n\n    while (parent && !traceCache.has(parent)) {\n      traceCache.add(parent)\n      parent.expanded = true\n      parent.visible = true\n      parent = parent.parent\n    }\n\n    // 非叶子节点将自身堆入\n    if (!node.isLeaf) {\n      traceCache.add(node)\n    }\n  }\n\n  function filter(filterMethod: string | ((node: TreeNode) => boolean)) {\n    traceCache.clear()\n\n    const filterFn =\n      typeof filterMethod === 'string'\n        ? (node: TreeNode) => defaultFilter(node, filterMethod)\n        : filterMethod\n\n    forest.value.dfs((node) => {\n      if (filterFn(node)) {\n        trace(node)\n      } else {\n        node.visible = false\n      }\n    })\n\n    getFlattedNodes()\n  }\n\n  return { filter }\n}\n"],"mappings":";AAcA,SAAgB,UAAU,SAAqC;CAC7D,MAAM,EAAE,QAAQ,oBAAoB;;;;;;;;CASpC,MAAM,6BAAa,IAAI,KAAe;CAEtC,SAAS,cAAc,MAAgB,IAAY;AACjD,MAAI,CAAC,GAAI,QAAO;AAChB,SAAO,KAAK,MAAM,SAAS,GAAG;;;;;;CAOhC,SAAS,MAAM,MAAgB;AAC7B,OAAK,UAAU;EACf,IAAI,SAAS,KAAK;AAElB,SAAO,UAAU,CAAC,WAAW,IAAI,OAAO,EAAE;AACxC,cAAW,IAAI,OAAO;AACtB,UAAO,WAAW;AAClB,UAAO,UAAU;AACjB,YAAS,OAAO;;AAIlB,MAAI,CAAC,KAAK,OACR,YAAW,IAAI,KAAK;;CAIxB,SAAS,OAAO,cAAsD;AACpE,aAAW,OAAO;EAElB,MAAM,WACJ,OAAO,iBAAiB,YACnB,SAAmB,cAAc,MAAM,aAAa,GACrD;AAEN,SAAO,MAAM,KAAK,SAAS;AACzB,OAAI,SAAS,KAAK,CAChB,OAAM,KAAK;OAEX,MAAK,UAAU;IAEjB;AAEF,mBAAiB;;AAGnB,QAAO,EAAE,QAAQ"}

package/dist/components/tree/use-select.js

@@ -0,0 +1,44 @@
+import { nextTick, shallowRef, watch } from "vue";
+//#region src/components/tree/use-select.ts
+/**
+* 单选
+*/
+function useSelect(options) {
+	const { emit, props, nodeDict, getFlattedNodes } = options;
+	let selectedData = shallowRef();
+	let selectByEvent = false;
+	watch([() => props.selected, nodeDict], ([s, nodeDict]) => {
+		if (selectByEvent || !props.selectable) return;
+		if (s) {
+			const node = nodeDict.get(s);
+			if (node) {
+				selectedData.value = node.data;
+				node.bubbleSet((node) => {
+					if (node.parent) {
+						if (node.parent.expanded) return false;
+						node.parent.expanded = true;
+					}
+				});
+			}
+		} else selectedData.value = void 0;
+		getFlattedNodes();
+		emit("selected-synced", selectedData.value);
+	}, { immediate: true });
+	const handleSelect = (node) => {
+		selectByEvent = true;
+		if (node.disabled) return;
+		selectedData.value = node.data === selectedData.value ? void 0 : node.data;
+		emit("update:selected", selectedData.value?.[props.valueKey], selectedData.value, node);
+		nextTick(() => {
+			selectByEvent = false;
+		});
+	};
+	return {
+		selectedData,
+		handleSelect
+	};
+}
+//#endregion
+export { useSelect };
+
+//# sourceMappingURL=use-select.js.map

package/dist/components/tree/use-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-select.js","names":[],"sources":["../../../src/components/tree/use-select.ts"],"sourcesContent":["import { nextTick, shallowRef, watch, type ComputedRef, type ShallowRef } from 'vue'\n\nimport type { TreeEmit, TreeProps } from '../../types'\nimport type { TreeNode } from './tree-node'\n\ninterface Options {\n  emit: TreeEmit\n  props: TreeProps\n  nodeDict: ComputedRef<Map<any, TreeNode>>\n  getFlattedNodes: () => void\n}\n\ninterface UseSelectReturned {\n  selectedData: ShallowRef<Record<string, any> | undefined>\n  handleSelect: (node: TreeNode) => void\n}\n\n/**\n * 单选\n */\nexport function useSelect(options: Options): UseSelectReturned {\n  const { emit, props, nodeDict, getFlattedNodes } = options\n  let selectedData = shallowRef<Record<string, any>>()\n\n  let selectByEvent = false\n  watch(\n    [() => props.selected, nodeDict],\n    ([s, nodeDict]) => {\n      if (selectByEvent || !props.selectable) return\n\n      if (s) {\n        const node = nodeDict.get(s)\n        if (node) {\n          selectedData.value = node.data\n          node.bubbleSet((node) => {\n            if (node.parent) {\n              if (node.parent.expanded) return false\n              node.parent.expanded = true\n            }\n          })\n        }\n      } else {\n        selectedData.value = undefined\n      }\n\n      getFlattedNodes()\n\n      emit('selected-synced', selectedData.value)\n    },\n    { immediate: true }\n  )\n\n  const handleSelect = (node: TreeNode) => {\n    selectByEvent = true\n    if (node.disabled) return\n    selectedData.value = node.data === selectedData.value ? undefined : node.data\n\n    emit('update:selected', selectedData.value?.[props.valueKey!], selectedData.value, node)\n\n    nextTick(() => {\n      selectByEvent = false\n    })\n  }\n\n  return { selectedData, handleSelect }\n}\n"],"mappings":";;;;;AAoBA,SAAgB,UAAU,SAAqC;CAC7D,MAAM,EAAE,MAAM,OAAO,UAAU,oBAAoB;CACnD,IAAI,eAAe,YAAiC;CAEpD,IAAI,gBAAgB;AACpB,OACE,OAAO,MAAM,UAAU,SAAS,GAC/B,CAAC,GAAG,cAAc;AACjB,MAAI,iBAAiB,CAAC,MAAM,WAAY;AAExC,MAAI,GAAG;GACL,MAAM,OAAO,SAAS,IAAI,EAAE;AAC5B,OAAI,MAAM;AACR,iBAAa,QAAQ,KAAK;AAC1B,SAAK,WAAW,SAAS;AACvB,SAAI,KAAK,QAAQ;AACf,UAAI,KAAK,OAAO,SAAU,QAAO;AACjC,WAAK,OAAO,WAAW;;MAEzB;;QAGJ,cAAa,QAAQ,KAAA;AAGvB,mBAAiB;AAEjB,OAAK,mBAAmB,aAAa,MAAM;IAE7C,EAAE,WAAW,MAAM,CACpB;CAED,MAAM,gBAAgB,SAAmB;AACvC,kBAAgB;AAChB,MAAI,KAAK,SAAU;AACnB,eAAa,QAAQ,KAAK,SAAS,aAAa,QAAQ,KAAA,IAAY,KAAK;AAEzE,OAAK,mBAAmB,aAAa,QAAQ,MAAM,WAAY,aAAa,OAAO,KAAK;AAExF,iBAAe;AACb,mBAAgB;IAChB;;AAGJ,QAAO;EAAE;EAAc;EAAc"}

package/dist/components/tree/use-tree-nodes.js

@@ -0,0 +1,59 @@
+import { TreeNode as TreeNode$1 } from "./tree-node2.js";
+import { computed, shallowRef } from "vue";
+import { Forest } from "@cat-kit/core";
+//#region src/components/tree/use-tree-nodes.ts
+function useTreeNodes(options) {
+	const { props } = options;
+	/** 森林 */
+	const forest = computed(() => {
+		const { disabledNode, expandAll = false, valueKey, labelKey } = props;
+		const childrenKey = props.childrenKey ?? "children";
+		function createNode(data, index, depth, _f, parent) {
+			const node = new TreeNode$1({
+				data,
+				index,
+				depth,
+				parent,
+				valueKey,
+				labelKey
+			});
+			node.expanded = expandAll;
+			return node;
+		}
+		return new Forest({
+			data: props.data,
+			childrenKey,
+			createNode: disabledNode ? (data, index, depth, f, parent) => {
+				const node = createNode(data, index, depth, f, parent);
+				if (data) node.disabled = disabledNode(data, node) ?? false;
+				return node;
+			} : (data, index, depth, f, parent) => createNode(data, index, depth, f, parent)
+		});
+	});
+	/** 碾平后的节点 */
+	const nodes = shallowRef([]);
+	/**
+	* 节点的字典，key为指定的valueKey的值
+	*/
+	const nodeDict = computed(() => {
+		const dict = /* @__PURE__ */ new Map();
+		forest.value.dfs((node) => {
+			dict.set(node.key, node);
+		});
+		return dict;
+	});
+	/** 获取碾平后的节点 */
+	function getFlattedNodes() {
+		nodes.value = forest.value.flattenVisible((n) => n.expanded).filter((n) => n.visible);
+	}
+	return {
+		nodes,
+		forest,
+		getFlattedNodes,
+		nodeDict
+	};
+}
+//#endregion
+export { useTreeNodes };
+
+//# sourceMappingURL=use-tree-nodes.js.map

package/dist/components/tree/use-tree-nodes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-tree-nodes.js","names":["TreeNode"],"sources":["../../../src/components/tree/use-tree-nodes.ts"],"sourcesContent":["import { Forest } from '@cat-kit/core'\nimport { computed, shallowRef, type ShallowRef, type ComputedRef } from 'vue'\n\nimport type { TreeProps } from '../../types'\nimport { TreeNode } from './tree-node'\n\ninterface Options {\n  props: TreeProps\n}\n\ninterface UseTreeNodesReturned {\n  nodes: ShallowRef<TreeNode[]>\n  forest: ComputedRef<Forest<Record<string, unknown>, any>>\n  getFlattedNodes: () => void\n  nodeDict: ComputedRef<Map<string | number, TreeNode>>\n}\nexport function useTreeNodes(options: Options): UseTreeNodesReturned {\n  const { props } = options\n\n  /** 森林 */\n  const forest = computed(() => {\n    const { disabledNode, expandAll = false, valueKey, labelKey } = props\n    const childrenKey = props.childrenKey ?? 'children'\n\n    function createNode(\n      data: Record<string, any>,\n      index: number,\n      depth: number,\n      _f: Forest<Record<string, unknown>, any>,\n      parent?: TreeNode\n    ) {\n      const node = new TreeNode({\n        data,\n        index,\n        depth,\n        parent,\n        valueKey: valueKey!,\n        labelKey: labelKey!\n      })\n      node.expanded = expandAll\n      return node\n    }\n\n    return new Forest<Record<string, unknown>, any>({\n      data: props.data! as Record<string, unknown>[],\n      childrenKey,\n      createNode: disabledNode\n        ? (data, index, depth, f, parent) => {\n            const node = createNode(\n              data as Record<string, any>,\n              index,\n              depth,\n              f,\n              parent as TreeNode\n            )\n            if (data) {\n              node.disabled = disabledNode(data, node) ?? false\n            }\n            return node\n          }\n        : (data, index, depth, f, parent) =>\n            createNode(data as Record<string, any>, index, depth, f, parent as TreeNode)\n    })\n  })\n\n  /** 碾平后的节点 */\n  const nodes = shallowRef<TreeNode[]>([])\n\n  /**\n   * 节点的字典，key为指定的valueKey的值\n   */\n  const nodeDict = computed(() => {\n    const dict = new Map<string | number, TreeNode>()\n\n    forest.value.dfs((node) => {\n      dict.set(node.key, node)\n    })\n\n    return dict\n  })\n\n  /** 获取碾平后的节点 */\n  function getFlattedNodes() {\n    nodes.value = forest.value.flattenVisible((n) => n.expanded).filter((n) => n.visible)\n  }\n\n  return { nodes, forest, getFlattedNodes, nodeDict }\n}\n"],"mappings":";;;;AAgBA,SAAgB,aAAa,SAAwC;CACnE,MAAM,EAAE,UAAU;;CAGlB,MAAM,SAAS,eAAe;EAC5B,MAAM,EAAE,cAAc,YAAY,OAAO,UAAU,aAAa;EAChE,MAAM,cAAc,MAAM,eAAe;EAEzC,SAAS,WACP,MACA,OACA,OACA,IACA,QACA;GACA,MAAM,OAAO,IAAIA,WAAS;IACxB;IACA;IACA;IACA;IACU;IACA;IACX,CAAC;AACF,QAAK,WAAW;AAChB,UAAO;;AAGT,SAAO,IAAI,OAAqC;GAC9C,MAAM,MAAM;GACZ;GACA,YAAY,gBACP,MAAM,OAAO,OAAO,GAAG,WAAW;IACjC,MAAM,OAAO,WACX,MACA,OACA,OACA,GACA,OACD;AACD,QAAI,KACF,MAAK,WAAW,aAAa,MAAM,KAAK,IAAI;AAE9C,WAAO;QAER,MAAM,OAAO,OAAO,GAAG,WACtB,WAAW,MAA6B,OAAO,OAAO,GAAG,OAAmB;GACnF,CAAC;GACF;;CAGF,MAAM,QAAQ,WAAuB,EAAE,CAAC;;;;CAKxC,MAAM,WAAW,eAAe;EAC9B,MAAM,uBAAO,IAAI,KAAgC;AAEjD,SAAO,MAAM,KAAK,SAAS;AACzB,QAAK,IAAI,KAAK,KAAK,KAAK;IACxB;AAEF,SAAO;GACP;;CAGF,SAAS,kBAAkB;AACzB,QAAM,QAAQ,OAAO,MAAM,gBAAgB,MAAM,EAAE,SAAS,CAAC,QAAQ,MAAM,EAAE,QAAQ;;AAGvF,QAAO;EAAE;EAAO;EAAQ;EAAiB;EAAU"}

package/dist/components/tree-select/index.d.ts

@@ -0,0 +1 @@
+import { _default } from "./tree-select.vue.js";

package/dist/components/tree-select/style.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/tree-select/style.js

@@ -0,0 +1 @@
+import "./style2.css";