@viewfly/core 1.0.0-alpha.16 → 1.0.0-alpha.17

package/bundles/index.d.ts

@@ -523,6 +523,8 @@ interface TextAtom {
     type: typeof TextAtomType;
     index: number;
     jsxNode: string;
+    nodeType: string;
+    key?: null;
     nativeNode: NativeNode | null;
     child: Atom | null;
     sibling: Atom | null;
@@ -531,6 +533,8 @@ interface TextAtom {
 interface ElementAtom {
     type: typeof ElementAtomType;
     index: number;
+    nodeType: string;
+    key?: Key;
     jsxNode: ViewFlyNode<string>;
     nativeNode: NativeNode | null;
     child: Atom | null;
@@ -540,6 +544,8 @@ interface ElementAtom {
 interface ComponentAtom {
     type: typeof ComponentAtomType;
     index: number;
+    nodeType: ComponentSetup;
+    key?: Key;
     jsxNode: ViewFlyNode<ComponentSetup> | Component;
     nativeNode: NativeNode | null;
     child: Atom | null;

package/bundles/index.esm.js

@@ -1294,6 +1294,7 @@ function createRenderer(component, nativeRenderer) {
             const atom = {
                 type: ComponentAtomType,
                 index: 0,
+                nodeType: component.type,
                 jsxNode: component,
                 sibling: null,
                 child: null,
@@ -1397,28 +1398,19 @@ function diff(nativeRenderer, parentComponent, newAtom, oldAtom, context) {
 }
 function createChanges(newAtom, oldAtom, nativeRenderer, commits, context, parentComponent, effect) {
     const startDiffAtom = oldAtom;
-    const { jsxNode: newJsxNode, type } = newAtom;
-    const key = newJsxNode.key;
     let prev = null;
     while (oldAtom) {
-        if (type === oldAtom.type) {
+        const newAtomType = newAtom.type;
+        if (oldAtom.type === newAtomType && oldAtom.nodeType === newAtom.nodeType && oldAtom.key === newAtom.key) {
             let commit;
-            if (type === TextAtomType) {
+            if (newAtomType === TextAtomType) {
                 commit = updateText(newAtom, oldAtom, nativeRenderer, context);
             }
+            else if (newAtomType === ComponentAtomType) {
+                commit = updateComponent(newAtom, oldAtom, nativeRenderer, context);
+            }
             else {
-                const { key: diffKey, type: diffType } = oldAtom.jsxNode;
-                if (diffKey !== key || newJsxNode.type !== diffType) {
-                    prev = oldAtom;
-                    oldAtom = oldAtom.sibling;
-                    continue;
-                }
-                if (type === ComponentAtomType) {
-                    commit = updateComponent(newAtom, oldAtom, nativeRenderer, context);
-                }
-                else {
-                    commit = updateElement(newAtom, oldAtom, nativeRenderer, context, parentComponent);
-                }
+                commit = updateElement(newAtom, oldAtom, nativeRenderer, context, parentComponent);
             }
             commits.push(commit);
             const next = oldAtom.sibling;
@@ -1441,12 +1433,12 @@ function createNewView(start, nativeRenderer, context, parentComponent, effect)
     };
 }
 function updateText(newAtom, oldAtom, nativeRenderer, context) {
-    return function () {
+    return function (offset) {
         const nativeNode = oldAtom.nativeNode;
-        if (newAtom.jsxNode !== oldAtom.jsxNode) {
-            nativeRenderer.syncTextContent(nativeNode, newAtom.jsxNode, newAtom.isSvg);
-        }
         newAtom.nativeNode = nativeNode;
+        if (newAtom.index - offset !== oldAtom.index) {
+            insertNode(nativeRenderer, newAtom, context);
+        }
         context.host = nativeNode;
         context.isParent = false;
     };
@@ -1560,7 +1552,7 @@ function componentRender(nativeRenderer, component, from, context) {
     }
     component.rendered();
 }
-function createChainByJSXNode(type, jsxNode, prevAtom, isSvg) {
+function createChainByJSXNode(type, jsxNode, nodeType, prevAtom, isSvg, key) {
     const atom = {
         type,
         index: prevAtom.index + 1,
@@ -1568,7 +1560,9 @@ function createChainByJSXNode(type, jsxNode, prevAtom, isSvg) {
         sibling: null,
         child: null,
         nativeNode: null,
-        isSvg
+        isSvg,
+        nodeType,
+        key
     };
     prevAtom.sibling = atom;
     return atom;
@@ -1577,7 +1571,7 @@ function createChainByNode(jsxNode, prevAtom, isSvg) {
     const type = typeof jsxNode;
     if (jsxNode !== null && type !== 'undefined' && type !== 'boolean') {
         if (typeof jsxNode === 'string') {
-            return createChainByJSXNode(TextAtomType, jsxNode, prevAtom, isSvg);
+            return createChainByJSXNode(TextAtomType, jsxNode, jsxNode, prevAtom, isSvg);
         }
         if (Array.isArray(jsxNode)) {
             return createChainByChildren(jsxNode, prevAtom, isSvg);
@@ -1585,13 +1579,14 @@ function createChainByNode(jsxNode, prevAtom, isSvg) {
         if (type === 'object') {
             const nodeType = typeof jsxNode.type;
             if (nodeType === 'string') {
-                return createChainByJSXNode(ElementAtomType, jsxNode, prevAtom, isSvg || jsxNode.type === 'svg');
+                return createChainByJSXNode(ElementAtomType, jsxNode, jsxNode.type, prevAtom, isSvg || jsxNode.type === 'svg', jsxNode.key);
             }
             else if (nodeType === 'function') {
-                return createChainByJSXNode(ComponentAtomType, jsxNode, prevAtom, isSvg);
+                return createChainByJSXNode(ComponentAtomType, jsxNode, jsxNode.type, prevAtom, isSvg, jsxNode.key);
             }
         }
-        return createChainByJSXNode(TextAtomType, String(jsxNode), prevAtom, isSvg);
+        const text = String(jsxNode);
+        return createChainByJSXNode(TextAtomType, text, text, prevAtom, isSvg);
     }
     return prevAtom;
 }
@@ -1685,10 +1680,12 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
     let unBindRefs;
     let bindRefs;
     newAtom.child = oldAtom.child;
+    let updatedSubComponent = false;
     for (const [key, value] of changes.remove) {
         if (key === 'children') {
             cleanElementChildren(oldAtom, nativeRenderer);
             newAtom.child = null;
+            updatedSubComponent = true;
             continue;
         }
         if (key === 'class') {
@@ -1726,6 +1723,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
                     rootHost: context.rootHost
                 });
             }
+            updatedSubComponent = true;
             continue;
         }
         if (key === 'class') {
@@ -1762,6 +1760,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         if (key === 'children') {
             newAtom.child = createChildChain(value, isSvg);
             buildElementChildren(newAtom, nativeRenderer, parentComponent, context);
+            updatedSubComponent = true;
             continue;
         }
         if (key === 'class') {
@@ -1787,6 +1786,11 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         }
         nativeRenderer.setProperty(nativeNode, key, value, isSvg);
     }
+    if (!updatedSubComponent) {
+        parentComponent.changedSubComponents.forEach(child => {
+            updateView(nativeRenderer, child);
+        });
+    }
     applyRefs(unBindRefs, nativeNode, false);
     applyRefs(bindRefs, nativeNode, true);
 }

package/bundles/index.js

@@ -1296,6 +1296,7 @@ function createRenderer(component, nativeRenderer) {
             const atom = {
                 type: ComponentAtomType,
                 index: 0,
+                nodeType: component.type,
                 jsxNode: component,
                 sibling: null,
                 child: null,
@@ -1399,28 +1400,19 @@ function diff(nativeRenderer, parentComponent, newAtom, oldAtom, context) {
 }
 function createChanges(newAtom, oldAtom, nativeRenderer, commits, context, parentComponent, effect) {
     const startDiffAtom = oldAtom;
-    const { jsxNode: newJsxNode, type } = newAtom;
-    const key = newJsxNode.key;
     let prev = null;
     while (oldAtom) {
-        if (type === oldAtom.type) {
+        const newAtomType = newAtom.type;
+        if (oldAtom.type === newAtomType && oldAtom.nodeType === newAtom.nodeType && oldAtom.key === newAtom.key) {
             let commit;
-            if (type === TextAtomType) {
+            if (newAtomType === TextAtomType) {
                 commit = updateText(newAtom, oldAtom, nativeRenderer, context);
             }
+            else if (newAtomType === ComponentAtomType) {
+                commit = updateComponent(newAtom, oldAtom, nativeRenderer, context);
+            }
             else {
-                const { key: diffKey, type: diffType } = oldAtom.jsxNode;
-                if (diffKey !== key || newJsxNode.type !== diffType) {
-                    prev = oldAtom;
-                    oldAtom = oldAtom.sibling;
-                    continue;
-                }
-                if (type === ComponentAtomType) {
-                    commit = updateComponent(newAtom, oldAtom, nativeRenderer, context);
-                }
-                else {
-                    commit = updateElement(newAtom, oldAtom, nativeRenderer, context, parentComponent);
-                }
+                commit = updateElement(newAtom, oldAtom, nativeRenderer, context, parentComponent);
             }
             commits.push(commit);
             const next = oldAtom.sibling;
@@ -1443,12 +1435,12 @@ function createNewView(start, nativeRenderer, context, parentComponent, effect)
     };
 }
 function updateText(newAtom, oldAtom, nativeRenderer, context) {
-    return function () {
+    return function (offset) {
         const nativeNode = oldAtom.nativeNode;
-        if (newAtom.jsxNode !== oldAtom.jsxNode) {
-            nativeRenderer.syncTextContent(nativeNode, newAtom.jsxNode, newAtom.isSvg);
-        }
         newAtom.nativeNode = nativeNode;
+        if (newAtom.index - offset !== oldAtom.index) {
+            insertNode(nativeRenderer, newAtom, context);
+        }
         context.host = nativeNode;
         context.isParent = false;
     };
@@ -1562,7 +1554,7 @@ function componentRender(nativeRenderer, component, from, context) {
     }
     component.rendered();
 }
-function createChainByJSXNode(type, jsxNode, prevAtom, isSvg) {
+function createChainByJSXNode(type, jsxNode, nodeType, prevAtom, isSvg, key) {
     const atom = {
         type,
         index: prevAtom.index + 1,
@@ -1570,7 +1562,9 @@ function createChainByJSXNode(type, jsxNode, prevAtom, isSvg) {
         sibling: null,
         child: null,
         nativeNode: null,
-        isSvg
+        isSvg,
+        nodeType,
+        key
     };
     prevAtom.sibling = atom;
     return atom;
@@ -1579,7 +1573,7 @@ function createChainByNode(jsxNode, prevAtom, isSvg) {
     const type = typeof jsxNode;
     if (jsxNode !== null && type !== 'undefined' && type !== 'boolean') {
         if (typeof jsxNode === 'string') {
-            return createChainByJSXNode(TextAtomType, jsxNode, prevAtom, isSvg);
+            return createChainByJSXNode(TextAtomType, jsxNode, jsxNode, prevAtom, isSvg);
         }
         if (Array.isArray(jsxNode)) {
             return createChainByChildren(jsxNode, prevAtom, isSvg);
@@ -1587,13 +1581,14 @@ function createChainByNode(jsxNode, prevAtom, isSvg) {
         if (type === 'object') {
             const nodeType = typeof jsxNode.type;
             if (nodeType === 'string') {
-                return createChainByJSXNode(ElementAtomType, jsxNode, prevAtom, isSvg || jsxNode.type === 'svg');
+                return createChainByJSXNode(ElementAtomType, jsxNode, jsxNode.type, prevAtom, isSvg || jsxNode.type === 'svg', jsxNode.key);
             }
             else if (nodeType === 'function') {
-                return createChainByJSXNode(ComponentAtomType, jsxNode, prevAtom, isSvg);
+                return createChainByJSXNode(ComponentAtomType, jsxNode, jsxNode.type, prevAtom, isSvg, jsxNode.key);
             }
         }
-        return createChainByJSXNode(TextAtomType, String(jsxNode), prevAtom, isSvg);
+        const text = String(jsxNode);
+        return createChainByJSXNode(TextAtomType, text, text, prevAtom, isSvg);
     }
     return prevAtom;
 }
@@ -1687,10 +1682,12 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
     let unBindRefs;
     let bindRefs;
     newAtom.child = oldAtom.child;
+    let updatedSubComponent = false;
     for (const [key, value] of changes.remove) {
         if (key === 'children') {
             cleanElementChildren(oldAtom, nativeRenderer);
             newAtom.child = null;
+            updatedSubComponent = true;
             continue;
         }
         if (key === 'class') {
@@ -1728,6 +1725,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
                     rootHost: context.rootHost
                 });
             }
+            updatedSubComponent = true;
             continue;
         }
         if (key === 'class') {
@@ -1764,6 +1762,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         if (key === 'children') {
             newAtom.child = createChildChain(value, isSvg);
             buildElementChildren(newAtom, nativeRenderer, parentComponent, context);
+            updatedSubComponent = true;
             continue;
         }
         if (key === 'class') {
@@ -1789,6 +1788,11 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         }
         nativeRenderer.setProperty(nativeNode, key, value, isSvg);
     }
+    if (!updatedSubComponent) {
+        parentComponent.changedSubComponents.forEach(child => {
+            updateView(nativeRenderer, child);
+        });
+    }
     applyRefs(unBindRefs, nativeNode, false);
     applyRefs(bindRefs, nativeNode, true);
 }

package/jsx-dev-runtime/node_modules/.bin/rimraf

@@ -0,0 +1,17 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*) basedir=`cygpath -w "$basedir"`;;
+esac
+
+if [ -z "$NODE_PATH" ]; then
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rimraf@3.0.2/node_modules/rimraf/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rimraf@3.0.2/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules"
+else
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rimraf@3.0.2/node_modules/rimraf/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rimraf@3.0.2/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules:$NODE_PATH"
+fi
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../rimraf/bin.js" "$@"
+else
+  exec node  "$basedir/../rimraf/bin.js" "$@"
+fi

package/jsx-dev-runtime/node_modules/.bin/rollup

@@ -0,0 +1,17 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*) basedir=`cygpath -w "$basedir"`;;
+esac
+
+if [ -z "$NODE_PATH" ]; then
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/bin/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules"
+else
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/bin/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/rollup@3.29.4/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules:$NODE_PATH"
+fi
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../rollup/dist/bin/rollup" "$@"
+else
+  exec node  "$basedir/../rollup/dist/bin/rollup" "$@"
+fi

package/jsx-dev-runtime/node_modules/.bin/tsc

@@ -0,0 +1,17 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*) basedir=`cygpath -w "$basedir"`;;
+esac
+
+if [ -z "$NODE_PATH" ]; then
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules"
+else
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules:$NODE_PATH"
+fi
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../../../../../node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/tsc" "$@"
+else
+  exec node  "$basedir/../../../../../node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/tsc" "$@"
+fi

package/jsx-dev-runtime/node_modules/.bin/tsserver

@@ -0,0 +1,17 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*) basedir=`cygpath -w "$basedir"`;;
+esac
+
+if [ -z "$NODE_PATH" ]; then
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules"
+else
+  export NODE_PATH="/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/typescript@5.4.5/node_modules:/Users/tanbo/Documents/lib/viewfly/node_modules/.pnpm/node_modules:$NODE_PATH"
+fi
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../../../../../node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/tsserver" "$@"
+else
+  exec node  "$basedir/../../../../../node_modules/.pnpm/typescript@5.4.5/node_modules/typescript/bin/tsserver" "$@"
+fi

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viewfly/core",
-  "version": "1.0.0-alpha.16",
+  "version": "1.0.0-alpha.17",
   "description": "Viewfly is a simple and easy-to-use JavaScript framework with an intuitive development experience.",
   "main": "./bundles/index.js",
   "module": "./bundles/index.esm.js",
@@ -50,7 +50,7 @@
   "bugs": {
     "url": "https://github.com/viewfly/viewfly.git/issues"
   },
-  "gitHead": "d2c8ce1c906fd80e05e27d677e7f678ccae0e9a1",
+  "gitHead": "4fd97b73e7808b45660f2b802f4b327a67366a7e",
   "dependencies": {
     "reflect-metadata": "^0.2.2"
   }