@splicetree/adapter-vue 0.1.1 → 0.2.0

package/README.md

@@ -1,11 +1,11 @@
 # @splicetree/adapter-vue
 
+提供响应式 `items` 与操作方法，自动监听核心事件刷新视图。
+
 ## 简介
 
 SpliceTree Vue 适配层，将核心 `items()` 适配为 `shallowRef` 响应式数据，并复用核心 API。
 
-提供响应式 `items` 与操作方法，自动监听核心事件刷新视图。
-
 [![version](https://img.shields.io/npm/v/@splicetree/adapter-vue.svg?label=version)](https://www.npmjs.com/package/@splicetree/adapter-vue)
 [![downloads](https://img.shields.io/npm/dm/@splicetree/adapter-vue.svg)](https://npmcharts.com/compare/%40splicetree%2Fadapter-vue?minimal=true)
 [![license](https://img.shields.io/npm/l/@splicetree/adapter-vue.svg)](https://www.npmjs.com/package/@splicetree/adapter-vue)

package/dist/index.js

@@ -314,8 +314,11 @@ function moveNode(ctx, id, newParentId, beforeId) {
 * - 提供插件扩展点（setup/extendNode）
 */
 function createSpliceTree(data, options = {}) {
-	const keyField = options.keyField ?? "id";
-	const parentField = options.parentField ?? "parent";
+	const cfg = options.configuration ?? {};
+	const keyField = cfg.keyField ?? options.keyField ?? "id";
+	const parentField = cfg.parentField ?? options.parentField ?? "parent";
+	const defaultExpanded = cfg.defaultExpanded ?? options.defaultExpanded;
+	const defaultExpandedLevel = cfg.defaultExpandedLevel ?? options.defaultExpandedLevel;
 	const events = createEmitter();
 	const expandedKeys = createReactive(/* @__PURE__ */ new Set(), (payload) => {
 		events.emit({
@@ -323,8 +326,8 @@ function createSpliceTree(data, options = {}) {
 			keys: Array.from(payload.target)
 		});
 	});
-	const { roots, map, parentCache, childrenCache } = buildTree(data, keyField, parentField, expandedKeys);
-	initDefaultExpansion(map, expandedKeys, options.defaultExpanded, options.defaultExpandedLevel);
+	let { roots, map, parentCache, childrenCache } = buildTree(data, keyField, parentField, expandedKeys);
+	initDefaultExpansion(map, expandedKeys, defaultExpanded, defaultExpandedLevel);
 	const emitVisibility = () => {
 		events.emit({
 			name: "visibility",
@@ -393,6 +396,22 @@ function createSpliceTree(data, options = {}) {
 				expandedKeys,
 				notify: emitVisibility
 			}, id, newParentId, beforeId);
+		},
+		syncData(next) {
+			tree.data = next;
+			const built = buildTree(next, keyField, parentField, expandedKeys);
+			roots = built.roots;
+			map = built.map;
+			parentCache = built.parentCache;
+			childrenCache = built.childrenCache;
+			const validIds = new Set(map.keys());
+			const toDelete = [];
+			expandedKeys.forEach((id) => {
+				if (!validIds.has(id)) toDelete.push(id);
+			});
+			for (const id of toDelete) expandedKeys.delete(id);
+			applyNodeExtensions();
+			emitVisibility();
 		}
 	};
 	const pluginCtx = {
@@ -404,15 +423,18 @@ function createSpliceTree(data, options = {}) {
 		const api = plugin.setup?.(pluginCtx);
 		Object.assign(tree, api);
 	});
-	if (options?.plugins?.length) for (const n of map.values()) for (const plugin of options.plugins) plugin.extendNode?.(n, pluginCtx);
-	for (const node of map.values()) {
-		node.isExpanded = () => tree.isExpanded(node.id);
-		node.toggleExpand = (expand) => {
-			if (expand === void 0) tree.toggleExpand(node.id);
-			else if (expand) tree.expand(node.id);
-			else tree.collapse(node.id);
-		};
+	function applyNodeExtensions() {
+		if (options?.plugins?.length) for (const n of map.values()) for (const plugin of options.plugins) plugin.extendNode?.(n, pluginCtx);
+		for (const node of map.values()) {
+			node.isExpanded = () => tree.isExpanded(node.id);
+			node.toggleExpand = (expand) => {
+				if (expand === void 0) tree.toggleExpand(node.id);
+				else if (expand) tree.expand(node.id);
+				else tree.collapse(node.id);
+			};
+		}
 	}
+	applyNodeExtensions();
 	return tree;
 }
 
@@ -436,7 +458,7 @@ function useSpliceTree(data, options = {}) {
 	};
 	createTree();
 	watch(() => toValue(data), () => {
-		createTree();
+		api.value.syncData(toValue(data));
 	}, {
 		deep: true,
 		immediate: false

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@splicetree/adapter-vue",
   "type": "module",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "author": {
     "email": "michael.cocova@gmail.com",
     "name": "Michael Cocova"
@@ -31,7 +31,7 @@
   },
   "devDependencies": {
     "vue": "^3.0.0",
-    "@splicetree/core": "0.1.1"
+    "@splicetree/core": "0.2.0"
   },
   "publishConfig": {
     "access": "public"