thunderous 2.0.2 → 2.0.4

package/dist/index.cjs

@@ -377,6 +377,7 @@ var evaluateBindings = (element, fragment) => {
             newNode.data = signal();
           });
         } else if (signal !== void 0 && newNode instanceof DocumentFragment) {
+          let init = false;
           createEffect(() => {
             const result = signal();
             const nextNode = createNewNode(result, element);
@@ -386,14 +387,28 @@ var evaluateBindings = (element, fragment) => {
               );
             }
             let lastSibling = element.lastChild;
+            for (const child2 of element.children) {
+              const key = child2.getAttribute("key");
+              if (key === null) continue;
+              const matchingNode = nextNode.querySelector(`[key="${key}"]`);
+              if (init && matchingNode === null) {
+                child2.remove();
+              }
+            }
             for (const child2 of nextNode.children) {
               const key = child2.getAttribute("key");
               const matchingNode = element.querySelector(`[key="${key}"]`);
               if (matchingNode === null) continue;
+              matchingNode.__customCallbackFns = child2.__customCallbackFns;
+              for (const attr of child2.attributes) {
+                matchingNode.setAttribute(attr.name, attr.value);
+              }
+              matchingNode.replaceChildren(...child2.childNodes);
               lastSibling = matchingNode.nextSibling;
               child2.replaceWith(matchingNode);
             }
             element.insertBefore(nextNode, lastSibling);
+            if (!init) init = true;
           });
         }
       });
@@ -655,8 +670,9 @@ var customElement = (render, options) => {
           get: (_, prop) => {
             if (!(prop in this.#propSignals)) this.#propSignals[prop] = createSignal();
             const [_getter, _setter] = this.#propSignals[prop];
+            let setFromProp = false;
             const setter = (newValue) => {
-              this[prop] = newValue;
+              if (!setFromProp) this[prop] = newValue;
               _setter(newValue);
             };
             const getter = () => {
@@ -673,6 +689,14 @@ You must set an initial value before calling a property signal's getter.
               return value;
             };
             getter.getter = true;
+            Object.defineProperty(this, prop, {
+              get: getter,
+              set: (newValue) => {
+                setFromProp = true;
+                _setter(newValue);
+                setFromProp = false;
+              }
+            });
             return [getter, setter];
           },
           set: () => {

package/dist/index.js

@@ -342,6 +342,7 @@ var evaluateBindings = (element, fragment) => {
             newNode.data = signal();
           });
         } else if (signal !== void 0 && newNode instanceof DocumentFragment) {
+          let init = false;
           createEffect(() => {
             const result = signal();
             const nextNode = createNewNode(result, element);
@@ -351,14 +352,28 @@ var evaluateBindings = (element, fragment) => {
               );
             }
             let lastSibling = element.lastChild;
+            for (const child2 of element.children) {
+              const key = child2.getAttribute("key");
+              if (key === null) continue;
+              const matchingNode = nextNode.querySelector(`[key="${key}"]`);
+              if (init && matchingNode === null) {
+                child2.remove();
+              }
+            }
             for (const child2 of nextNode.children) {
               const key = child2.getAttribute("key");
               const matchingNode = element.querySelector(`[key="${key}"]`);
               if (matchingNode === null) continue;
+              matchingNode.__customCallbackFns = child2.__customCallbackFns;
+              for (const attr of child2.attributes) {
+                matchingNode.setAttribute(attr.name, attr.value);
+              }
+              matchingNode.replaceChildren(...child2.childNodes);
               lastSibling = matchingNode.nextSibling;
               child2.replaceWith(matchingNode);
             }
             element.insertBefore(nextNode, lastSibling);
+            if (!init) init = true;
           });
         }
       });
@@ -620,8 +635,9 @@ var customElement = (render, options) => {
           get: (_, prop) => {
             if (!(prop in this.#propSignals)) this.#propSignals[prop] = createSignal();
             const [_getter, _setter] = this.#propSignals[prop];
+            let setFromProp = false;
             const setter = (newValue) => {
-              this[prop] = newValue;
+              if (!setFromProp) this[prop] = newValue;
               _setter(newValue);
             };
             const getter = () => {
@@ -638,6 +654,14 @@ You must set an initial value before calling a property signal's getter.
               return value;
             };
             getter.getter = true;
+            Object.defineProperty(this, prop, {
+              get: getter,
+              set: (newValue) => {
+                setFromProp = true;
+                _setter(newValue);
+                setFromProp = false;
+              }
+            });
             return [getter, setter];
           },
           set: () => {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "thunderous",
-	"version": "2.0.2",
+	"version": "2.0.4",
 	"description": "",
 	"type": "module",
 	"main": "./dist/index.cjs",