@viewfly/core 3.0.0-alpha.4 → 3.0.0-alpha.5

package/dist/base/component.d.ts

@@ -15,9 +15,9 @@ export interface ComponentSetup<P = any> {
 export interface ComponentViewMetadata {
     atom: ComponentAtom;
     anchorNode: NativeNode;
+    contextContainer: NativeNode;
     isParent: boolean;
-    rootContainer: NativeNode;
-    expectContainer: NativeNode;
+    computedContainer: NativeNode;
 }
 /**
  * Viewfly 组件管理类，用于管理组件的生命周期，上下文等

package/dist/index.esm.js

@@ -1951,7 +1951,8 @@ function createRenderer(component, nativeRenderer, namespace) {
 			}, {
 				isParent: true,
 				anchorNode: container,
-				rootContainer: container
+				contextContainer: container,
+				computedContainer: container
 			});
 		} else deepUpdateByComponentDirtyTree(nativeRenderer, component, false);
 	};
@@ -1973,33 +1974,39 @@ function buildElementChildren(atom, nativeRenderer, parentComponent, context) {
 	}
 }
 function patchComponent(nativeRenderer, component, oldChildAtom, newAtom, context, needMove) {
-	const oldContainer = component.viewMetadata.anchorNode;
-	const expectContainer = component.viewMetadata.expectContainer;
 	const newTemplate = component.rerender();
 	const portalContainer = getContainer();
+	const rawContext = context;
+	const { computedContainer } = component.viewMetadata;
 	popContainer();
-	if (portalContainer && portalContainer !== expectContainer) context = {
-		isParent: true,
-		anchorNode: portalContainer,
-		rootContainer: portalContainer
-	};
+	if (portalContainer) if (portalContainer === context.contextContainer) {
+		if (portalContainer !== computedContainer) needMove = true;
+	} else {
+		needMove = true;
+		context = {
+			isParent: true,
+			anchorNode: portalContainer,
+			contextContainer: context.contextContainer,
+			computedContainer: portalContainer
+		};
+	}
+	else if (computedContainer !== context.contextContainer) needMove = true;
 	component.viewMetadata = {
 		atom: newAtom,
-		expectContainer,
 		...context
 	};
-	if (oldContainer !== context.anchorNode) needMove = true;
 	newAtom.child = createChildChain(newTemplate, nativeRenderer, newAtom.namespace);
 	diff(nativeRenderer, component, newAtom.child, oldChildAtom, context, needMove);
-	return context;
+	return rawContext;
 }
 function deepUpdateByComponentDirtyTree(nativeRenderer, component, needMove) {
 	if (component.dirty) {
-		const { atom, anchorNode, isParent, rootContainer } = component.viewMetadata;
+		const { atom, anchorNode, isParent, computedContainer, contextContainer } = component.viewMetadata;
 		const context = {
 			anchorNode,
 			isParent,
-			rootContainer
+			contextContainer,
+			computedContainer
 		};
 		const diffAtom = atom.child;
 		patchComponent(nativeRenderer, component, diffAtom, atom, context, needMove);
@@ -2095,8 +2102,9 @@ function updateElement(nativeRenderer, context, parentComponent, offset, needMov
 	context.isParent = false;
 	updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComponent, {
 		anchorNode: nativeNode,
+		contextContainer: nativeNode,
 		isParent: true,
-		rootContainer: context.rootContainer
+		computedContainer: nativeNode
 	});
 }
 function updateComponent(nativeRenderer, context, offset, needMove, newAtom, oldAtom) {
@@ -2116,7 +2124,6 @@ function updateComponent(nativeRenderer, context, offset, needMove, newAtom, old
 	} else {
 		component.viewMetadata = {
 			atom: newAtom,
-			expectContainer: component.viewMetadata.expectContainer,
 			...context
 		};
 		newAtom.child = oldAtom.child;
@@ -2161,7 +2168,7 @@ function cleanElementChildren(atom, nativeRenderer) {
 function cleanView(nativeRenderer, atom, needClean) {
 	if (atom.type === ComponentAtomType) {
 		const jsxNode = atom.jsxNode;
-		if (jsxNode.viewMetadata.anchorNode !== jsxNode.viewMetadata.expectContainer) needClean = true;
+		if (jsxNode.viewMetadata.computedContainer !== jsxNode.viewMetadata.contextContainer) needClean = true;
 		cleanChildren(atom, nativeRenderer, needClean);
 		jsxNode.destroy();
 		return;
@@ -2193,15 +2200,14 @@ function componentRender(nativeRenderer, component, from, context) {
 		const portalContainer = getContainer();
 		popContainer();
 		from.child = createChildChain(template, nativeRenderer, from.namespace);
-		const expectContainer = context.anchorNode;
-		context = portalContainer && portalContainer !== context.anchorNode ? {
+		if (portalContainer && portalContainer !== context.contextContainer) context = {
 			isParent: true,
 			anchorNode: portalContainer,
-			rootContainer: portalContainer
-		} : context;
+			contextContainer: context.contextContainer,
+			computedContainer: portalContainer
+		};
 		component.viewMetadata = {
 			atom: from,
-			expectContainer,
 			...context
 		};
 		let child = from.child;
@@ -2258,8 +2264,8 @@ function createChildChain(template, nativeRenderer, namespace) {
 	return beforeAtom.sibling;
 }
 function insertNode(nativeRenderer, atom, context) {
-	if (context.isParent) if (context.anchorNode === context.rootContainer) nativeRenderer.appendChild(context.anchorNode, atom.nativeNode, atom.namespace);
-	else nativeRenderer.prependChild(context.anchorNode, atom.nativeNode, atom.namespace);
+	if (context.isParent) if (context.contextContainer === context.computedContainer) nativeRenderer.prependChild(context.anchorNode, atom.nativeNode, atom.namespace);
+	else nativeRenderer.appendChild(context.anchorNode, atom.nativeNode, atom.namespace);
 	else nativeRenderer.insertAfter(atom.nativeNode, context.anchorNode, atom.namespace);
 }
 function createElementChildren(type, children, nativeRenderer, namespace) {
@@ -2301,7 +2307,8 @@ function createElement(nativeRenderer, atom, parentComponent, context) {
 	buildElementChildren(atom, nativeRenderer, parentComponent, {
 		isParent: true,
 		anchorNode: nativeNode,
-		rootContainer: context.rootContainer
+		contextContainer: nativeNode,
+		computedContainer: nativeNode
 	});
 	context.anchorNode = nativeNode;
 	context.isParent = false;

package/dist/index.js

@@ -1952,7 +1952,8 @@ function createRenderer(component, nativeRenderer, namespace) {
 			}, {
 				isParent: true,
 				anchorNode: container,
-				rootContainer: container
+				contextContainer: container,
+				computedContainer: container
 			});
 		} else deepUpdateByComponentDirtyTree(nativeRenderer, component, false);
 	};
@@ -1974,33 +1975,39 @@ function buildElementChildren(atom, nativeRenderer, parentComponent, context) {
 	}
 }
 function patchComponent(nativeRenderer, component, oldChildAtom, newAtom, context, needMove) {
-	const oldContainer = component.viewMetadata.anchorNode;
-	const expectContainer = component.viewMetadata.expectContainer;
 	const newTemplate = component.rerender();
 	const portalContainer = getContainer();
+	const rawContext = context;
+	const { computedContainer } = component.viewMetadata;
 	popContainer();
-	if (portalContainer && portalContainer !== expectContainer) context = {
-		isParent: true,
-		anchorNode: portalContainer,
-		rootContainer: portalContainer
-	};
+	if (portalContainer) if (portalContainer === context.contextContainer) {
+		if (portalContainer !== computedContainer) needMove = true;
+	} else {
+		needMove = true;
+		context = {
+			isParent: true,
+			anchorNode: portalContainer,
+			contextContainer: context.contextContainer,
+			computedContainer: portalContainer
+		};
+	}
+	else if (computedContainer !== context.contextContainer) needMove = true;
 	component.viewMetadata = {
 		atom: newAtom,
-		expectContainer,
 		...context
 	};
-	if (oldContainer !== context.anchorNode) needMove = true;
 	newAtom.child = createChildChain(newTemplate, nativeRenderer, newAtom.namespace);
 	diff(nativeRenderer, component, newAtom.child, oldChildAtom, context, needMove);
-	return context;
+	return rawContext;
 }
 function deepUpdateByComponentDirtyTree(nativeRenderer, component, needMove) {
 	if (component.dirty) {
-		const { atom, anchorNode, isParent, rootContainer } = component.viewMetadata;
+		const { atom, anchorNode, isParent, computedContainer, contextContainer } = component.viewMetadata;
 		const context = {
 			anchorNode,
 			isParent,
-			rootContainer
+			contextContainer,
+			computedContainer
 		};
 		const diffAtom = atom.child;
 		patchComponent(nativeRenderer, component, diffAtom, atom, context, needMove);
@@ -2096,8 +2103,9 @@ function updateElement(nativeRenderer, context, parentComponent, offset, needMov
 	context.isParent = false;
 	updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComponent, {
 		anchorNode: nativeNode,
+		contextContainer: nativeNode,
 		isParent: true,
-		rootContainer: context.rootContainer
+		computedContainer: nativeNode
 	});
 }
 function updateComponent(nativeRenderer, context, offset, needMove, newAtom, oldAtom) {
@@ -2117,7 +2125,6 @@ function updateComponent(nativeRenderer, context, offset, needMove, newAtom, old
 	} else {
 		component.viewMetadata = {
 			atom: newAtom,
-			expectContainer: component.viewMetadata.expectContainer,
 			...context
 		};
 		newAtom.child = oldAtom.child;
@@ -2162,7 +2169,7 @@ function cleanElementChildren(atom, nativeRenderer) {
 function cleanView(nativeRenderer, atom, needClean) {
 	if (atom.type === ComponentAtomType) {
 		const jsxNode = atom.jsxNode;
-		if (jsxNode.viewMetadata.anchorNode !== jsxNode.viewMetadata.expectContainer) needClean = true;
+		if (jsxNode.viewMetadata.computedContainer !== jsxNode.viewMetadata.contextContainer) needClean = true;
 		cleanChildren(atom, nativeRenderer, needClean);
 		jsxNode.destroy();
 		return;
@@ -2194,15 +2201,14 @@ function componentRender(nativeRenderer, component, from, context) {
 		const portalContainer = getContainer();
 		popContainer();
 		from.child = createChildChain(template, nativeRenderer, from.namespace);
-		const expectContainer = context.anchorNode;
-		context = portalContainer && portalContainer !== context.anchorNode ? {
+		if (portalContainer && portalContainer !== context.contextContainer) context = {
 			isParent: true,
 			anchorNode: portalContainer,
-			rootContainer: portalContainer
-		} : context;
+			contextContainer: context.contextContainer,
+			computedContainer: portalContainer
+		};
 		component.viewMetadata = {
 			atom: from,
-			expectContainer,
 			...context
 		};
 		let child = from.child;
@@ -2259,8 +2265,8 @@ function createChildChain(template, nativeRenderer, namespace) {
 	return beforeAtom.sibling;
 }
 function insertNode(nativeRenderer, atom, context) {
-	if (context.isParent) if (context.anchorNode === context.rootContainer) nativeRenderer.appendChild(context.anchorNode, atom.nativeNode, atom.namespace);
-	else nativeRenderer.prependChild(context.anchorNode, atom.nativeNode, atom.namespace);
+	if (context.isParent) if (context.contextContainer === context.computedContainer) nativeRenderer.prependChild(context.anchorNode, atom.nativeNode, atom.namespace);
+	else nativeRenderer.appendChild(context.anchorNode, atom.nativeNode, atom.namespace);
 	else nativeRenderer.insertAfter(atom.nativeNode, context.anchorNode, atom.namespace);
 }
 function createElementChildren(type, children, nativeRenderer, namespace) {
@@ -2302,7 +2308,8 @@ function createElement(nativeRenderer, atom, parentComponent, context) {
 	buildElementChildren(atom, nativeRenderer, parentComponent, {
 		isParent: true,
 		anchorNode: nativeNode,
-		rootContainer: context.rootContainer
+		contextContainer: nativeNode,
+		computedContainer: nativeNode
 	});
 	context.anchorNode = nativeNode;
 	context.isParent = false;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viewfly/core",
-  "version": "3.0.0-alpha.4",
+  "version": "3.0.0-alpha.5",
   "description": "Viewfly is a simple and easy-to-use JavaScript framework with an intuitive development experience.",
   "main": "./dist/index.js",
   "module": "./dist/index.esm.js",