thunderous 2.4.5 → 2.4.6

package/dist/index.cjs

@@ -102,13 +102,14 @@ var createSignal = (initVal, options) => {
       const effectRef = effects.get(sym);
       if (effectRef !== void 0) {
         try {
-          effectRef.fn({
+          const result = effectRef.fn({
             lastValue: effectRef.value,
             destroy: () => {
               effects.delete(sym);
               queueMicrotask(() => subscribers.delete(sym));
             }
           });
+          if (result !== void 0) effectRef.value = result;
         } catch (error) {
           console.error("Error in subscriber:", { error, oldValue, newValue, fn: effectRef.fn });
         }
@@ -149,14 +150,16 @@ var derived = (fn, options) => {
 };
 var createEffect = (fn, value) => {
   const privateIdent = ident = {};
-  effects.set(ident, { fn, value });
+  const effectRef = { fn, value };
+  effects.set(ident, effectRef);
   try {
-    fn({
+    const result = fn({
       lastValue: value,
       destroy: () => {
         effects.delete(privateIdent);
       }
     });
+    if (result !== void 0) effectRef.value = result;
   } catch (error) {
     console.error("Error in effect:", { error, fn });
   }
@@ -450,15 +453,11 @@ var evaluateBindings = (element, fragment) => {
       signalEntries.forEach(({ uniqueKey, signal, initialChildren, autoKey }) => {
         const firstChild = initialChildren[0];
         const lastChild = initialChildren[initialChildren.length - 1];
-        if (uniqueKey === void 0 || firstChild === void 0) return;
+        if (firstChild === void 0) return;
         const startAnchor = document.createComment(`${uniqueKey}:start`);
         firstChild.before(startAnchor);
         const endAnchor = document.createComment(`${uniqueKey}:end`);
-        if (lastChild !== void 0) {
-          lastChild.after(endAnchor);
-        } else {
-          startAnchor.after(endAnchor);
-        }
+        lastChild.after(endAnchor);
         const bindText = (node, signal2) => {
           createEffect(({ destroy }) => {
             const result = signal2();
@@ -482,11 +481,6 @@ var evaluateBindings = (element, fragment) => {
               const newChildren = asNodeList(result, element, autoKey2);
               const firstChild2 = newChildren[0];
               if (!Array.isArray(result)) {
-                if (newChildren.length === 1 && firstChild2 instanceof DocumentFragment) {
-                  destroy();
-                  bindFragment(signal2, initialChildren, autoKey2);
-                  return;
-                }
                 if (newChildren.length === 1 && firstChild2 instanceof Text) {
                   while (startAnchor.nextSibling !== endAnchor) {
                     startAnchor.nextSibling?.remove();
@@ -505,7 +499,6 @@ var evaluateBindings = (element, fragment) => {
               for (const persistedChild of oldChildren) {
                 if (persistedChild instanceof Element) {
                   const key = persistedChild.getAttribute("key");
-                  if (key === null) continue;
                   const newChild = queryChildren(newChildren, `[key="${key}"]`);
                   if (newChild === null) {
                     persistedChild.remove();
@@ -565,16 +558,14 @@ var evaluateBindings = (element, fragment) => {
             startAnchor.after(...children);
           });
         };
-        if (signal !== void 0) {
-          const currentValue = signal();
-          if (Array.isArray(currentValue)) {
-            bindArray(signal, autoKey);
-          } else if (currentValue instanceof DocumentFragment) {
-            bindFragment(signal, initialChildren, autoKey);
-          } else {
-            const initialChild = initialChildren[0];
-            bindText(initialChild, signal);
-          }
+        const currentValue = signal();
+        if (Array.isArray(currentValue)) {
+          bindArray(signal, autoKey);
+        } else if (currentValue instanceof DocumentFragment) {
+          bindFragment(signal, initialChildren, autoKey);
+        } else {
+          const initialChild = initialChildren[0];
+          bindText(initialChild, signal);
         }
       });
     }
@@ -611,7 +602,6 @@ var evaluateBindings = (element, fragment) => {
               if (newText !== prevText) child.setAttribute(attrName, newText);
             }
             if (attrName.startsWith("prop-id:")) {
-              if (child.hasAttribute(attrName)) child.removeAttribute(attrName);
               const propId = attrName.replace("prop-id:", "");
               const propName = renderState.propertyMap.get(propId);
               if (propName === void 0) {
@@ -646,9 +636,7 @@ var evaluateBindings = (element, fragment) => {
                 child.__customCallbackFns.set(uniqueKey, callback);
               }
             }
-            if (uniqueKey !== "" && !attrName.startsWith("prop-id:")) {
-              child.setAttribute(attrName, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
-            } else if (attrName.startsWith("prop-id:")) {
+            if (attrName.startsWith("prop-id:")) {
               child.removeAttribute(attrName);
               const propId = attrName.replace("prop-id:", "");
               const propName = renderState.propertyMap.get(propId);
@@ -661,6 +649,8 @@ var evaluateBindings = (element, fragment) => {
               }
               if (!(propName in child)) logPropertyWarning(propName, child);
               child[propName] = child.__customCallbackFns.get(uniqueKey);
+            } else {
+              child.setAttribute(attrName, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
             }
           });
         } else if (attrName.startsWith("prop-id:")) {
@@ -690,7 +680,7 @@ var html = (strings, ...values) => {
     } else {
       value = processValue(value);
     }
-    innerHTML2 += str + String(value === null ? "" : value);
+    innerHTML2 += str + String(value);
     return innerHTML2;
   }, "");
   if (isServer) return innerHTML;
@@ -711,7 +701,7 @@ var html = (strings, ...values) => {
   evaluateBindings(fragment, fragment);
   return fragment;
 };
-var adoptedStylesSupported = typeof window !== "undefined" && window.ShadowRoot?.prototype.hasOwnProperty("adoptedStyleSheets") && window.CSSStyleSheet?.prototype.hasOwnProperty("replace");
+var isAdoptedStylesSupported = () => typeof window !== "undefined" && window.ShadowRoot?.prototype.hasOwnProperty("adoptedStyleSheets") && window.CSSStyleSheet?.prototype.hasOwnProperty("replace");
 var isCSSStyleSheet = (stylesheet) => {
   return typeof CSSStyleSheet !== "undefined" && stylesheet instanceof CSSStyleSheet;
 };
@@ -735,7 +725,7 @@ var css = (strings, ...values) => {
   if (isServer) {
     return cssText;
   }
-  const stylesheet = adoptedStylesSupported ? new CSSStyleSheet() : document.createElement("style");
+  const stylesheet = isAdoptedStylesSupported() ? new CSSStyleSheet() : document.createElement("style");
   const textList = cssText.split(signalBindingRegex);
   createEffect(() => {
     const newCSSTextList = [];
@@ -842,7 +832,6 @@ var customElement = (render, options) => {
     #observer = options?.observedAttributes !== void 0 ? null : new MutationObserver((mutations) => {
       for (const mutation of mutations) {
         const attrName = mutation.attributeName;
-        if (mutation.type !== "attributes" || attrName === null) continue;
         if (!(attrName in this.#attrSignals)) {
           this.#attrSignals[attrName] = createSignal(this.getAttribute(attrName));
         }
@@ -1016,9 +1005,7 @@ You must set an initial value before calling a property signal's getter.
     constructor() {
       try {
         super();
-        if (!Object.prototype.hasOwnProperty.call(this, "__customCallbackFns")) {
-          this.__customCallbackFns = /* @__PURE__ */ new Map();
-        }
+        this.__customCallbackFns = /* @__PURE__ */ new Map();
         for (const attr of this.attributes) {
           this.#attrSignals[attr.name] = createSignal(attr.value);
         }
@@ -1029,7 +1016,6 @@ You must set an initial value before calling a property signal's getter.
           { cause: error }
         );
         console.error(_error);
-        throw _error;
       }
     }
     connectedCallback() {
@@ -1055,12 +1041,10 @@ You must set an initial value before calling a property signal's getter.
       }
       for (const attrName of Object.keys(this.#attrSignals)) {
         const signal = this.#attrSignals[attrName];
-        if (signal) {
-          const [getter, setter] = signal;
-          const currentValue = this.getAttribute(attrName);
-          if (getter() !== currentValue) {
-            setter(currentValue);
-          }
+        const [getter, setter] = signal;
+        const currentValue = this.getAttribute(attrName);
+        if (getter() !== currentValue) {
+          setter(currentValue);
         }
       }
       if (this.#observer !== null) {

package/dist/index.d.cts

@@ -94,7 +94,7 @@ type RegistryArgs = {
 
 type Styles = CSSStyleSheet | HTMLStyleElement;
 
-type SignalOptions = { debugMode: boolean; label?: string };
+type SignalOptions = { debugMode?: boolean; label?: string };
 type SignalGetter<T> = {
 	(options?: SignalOptions): T;
 	getter: true;

package/dist/index.d.ts

@@ -94,7 +94,7 @@ type RegistryArgs = {
 
 type Styles = CSSStyleSheet | HTMLStyleElement;
 
-type SignalOptions = { debugMode: boolean; label?: string };
+type SignalOptions = { debugMode?: boolean; label?: string };
 type SignalGetter<T> = {
 	(options?: SignalOptions): T;
 	getter: true;

package/dist/index.js

@@ -65,13 +65,14 @@ var createSignal = (initVal, options) => {
       const effectRef = effects.get(sym);
       if (effectRef !== void 0) {
         try {
-          effectRef.fn({
+          const result = effectRef.fn({
             lastValue: effectRef.value,
             destroy: () => {
               effects.delete(sym);
               queueMicrotask(() => subscribers.delete(sym));
             }
           });
+          if (result !== void 0) effectRef.value = result;
         } catch (error) {
           console.error("Error in subscriber:", { error, oldValue, newValue, fn: effectRef.fn });
         }
@@ -112,14 +113,16 @@ var derived = (fn, options) => {
 };
 var createEffect = (fn, value) => {
   const privateIdent = ident = {};
-  effects.set(ident, { fn, value });
+  const effectRef = { fn, value };
+  effects.set(ident, effectRef);
   try {
-    fn({
+    const result = fn({
       lastValue: value,
       destroy: () => {
         effects.delete(privateIdent);
       }
     });
+    if (result !== void 0) effectRef.value = result;
   } catch (error) {
     console.error("Error in effect:", { error, fn });
   }
@@ -413,15 +416,11 @@ var evaluateBindings = (element, fragment) => {
       signalEntries.forEach(({ uniqueKey, signal, initialChildren, autoKey }) => {
         const firstChild = initialChildren[0];
         const lastChild = initialChildren[initialChildren.length - 1];
-        if (uniqueKey === void 0 || firstChild === void 0) return;
+        if (firstChild === void 0) return;
         const startAnchor = document.createComment(`${uniqueKey}:start`);
         firstChild.before(startAnchor);
         const endAnchor = document.createComment(`${uniqueKey}:end`);
-        if (lastChild !== void 0) {
-          lastChild.after(endAnchor);
-        } else {
-          startAnchor.after(endAnchor);
-        }
+        lastChild.after(endAnchor);
         const bindText = (node, signal2) => {
           createEffect(({ destroy }) => {
             const result = signal2();
@@ -445,11 +444,6 @@ var evaluateBindings = (element, fragment) => {
               const newChildren = asNodeList(result, element, autoKey2);
               const firstChild2 = newChildren[0];
               if (!Array.isArray(result)) {
-                if (newChildren.length === 1 && firstChild2 instanceof DocumentFragment) {
-                  destroy();
-                  bindFragment(signal2, initialChildren, autoKey2);
-                  return;
-                }
                 if (newChildren.length === 1 && firstChild2 instanceof Text) {
                   while (startAnchor.nextSibling !== endAnchor) {
                     startAnchor.nextSibling?.remove();
@@ -468,7 +462,6 @@ var evaluateBindings = (element, fragment) => {
               for (const persistedChild of oldChildren) {
                 if (persistedChild instanceof Element) {
                   const key = persistedChild.getAttribute("key");
-                  if (key === null) continue;
                   const newChild = queryChildren(newChildren, `[key="${key}"]`);
                   if (newChild === null) {
                     persistedChild.remove();
@@ -528,16 +521,14 @@ var evaluateBindings = (element, fragment) => {
             startAnchor.after(...children);
           });
         };
-        if (signal !== void 0) {
-          const currentValue = signal();
-          if (Array.isArray(currentValue)) {
-            bindArray(signal, autoKey);
-          } else if (currentValue instanceof DocumentFragment) {
-            bindFragment(signal, initialChildren, autoKey);
-          } else {
-            const initialChild = initialChildren[0];
-            bindText(initialChild, signal);
-          }
+        const currentValue = signal();
+        if (Array.isArray(currentValue)) {
+          bindArray(signal, autoKey);
+        } else if (currentValue instanceof DocumentFragment) {
+          bindFragment(signal, initialChildren, autoKey);
+        } else {
+          const initialChild = initialChildren[0];
+          bindText(initialChild, signal);
         }
       });
     }
@@ -574,7 +565,6 @@ var evaluateBindings = (element, fragment) => {
               if (newText !== prevText) child.setAttribute(attrName, newText);
             }
             if (attrName.startsWith("prop-id:")) {
-              if (child.hasAttribute(attrName)) child.removeAttribute(attrName);
               const propId = attrName.replace("prop-id:", "");
               const propName = renderState.propertyMap.get(propId);
               if (propName === void 0) {
@@ -609,9 +599,7 @@ var evaluateBindings = (element, fragment) => {
                 child.__customCallbackFns.set(uniqueKey, callback);
               }
             }
-            if (uniqueKey !== "" && !attrName.startsWith("prop-id:")) {
-              child.setAttribute(attrName, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
-            } else if (attrName.startsWith("prop-id:")) {
+            if (attrName.startsWith("prop-id:")) {
               child.removeAttribute(attrName);
               const propId = attrName.replace("prop-id:", "");
               const propName = renderState.propertyMap.get(propId);
@@ -624,6 +612,8 @@ var evaluateBindings = (element, fragment) => {
               }
               if (!(propName in child)) logPropertyWarning(propName, child);
               child[propName] = child.__customCallbackFns.get(uniqueKey);
+            } else {
+              child.setAttribute(attrName, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
             }
           });
         } else if (attrName.startsWith("prop-id:")) {
@@ -653,7 +643,7 @@ var html = (strings, ...values) => {
     } else {
       value = processValue(value);
     }
-    innerHTML2 += str + String(value === null ? "" : value);
+    innerHTML2 += str + String(value);
     return innerHTML2;
   }, "");
   if (isServer) return innerHTML;
@@ -674,7 +664,7 @@ var html = (strings, ...values) => {
   evaluateBindings(fragment, fragment);
   return fragment;
 };
-var adoptedStylesSupported = typeof window !== "undefined" && window.ShadowRoot?.prototype.hasOwnProperty("adoptedStyleSheets") && window.CSSStyleSheet?.prototype.hasOwnProperty("replace");
+var isAdoptedStylesSupported = () => typeof window !== "undefined" && window.ShadowRoot?.prototype.hasOwnProperty("adoptedStyleSheets") && window.CSSStyleSheet?.prototype.hasOwnProperty("replace");
 var isCSSStyleSheet = (stylesheet) => {
   return typeof CSSStyleSheet !== "undefined" && stylesheet instanceof CSSStyleSheet;
 };
@@ -698,7 +688,7 @@ var css = (strings, ...values) => {
   if (isServer) {
     return cssText;
   }
-  const stylesheet = adoptedStylesSupported ? new CSSStyleSheet() : document.createElement("style");
+  const stylesheet = isAdoptedStylesSupported() ? new CSSStyleSheet() : document.createElement("style");
   const textList = cssText.split(signalBindingRegex);
   createEffect(() => {
     const newCSSTextList = [];
@@ -805,7 +795,6 @@ var customElement = (render, options) => {
     #observer = options?.observedAttributes !== void 0 ? null : new MutationObserver((mutations) => {
       for (const mutation of mutations) {
         const attrName = mutation.attributeName;
-        if (mutation.type !== "attributes" || attrName === null) continue;
         if (!(attrName in this.#attrSignals)) {
           this.#attrSignals[attrName] = createSignal(this.getAttribute(attrName));
         }
@@ -979,9 +968,7 @@ You must set an initial value before calling a property signal's getter.
     constructor() {
       try {
         super();
-        if (!Object.prototype.hasOwnProperty.call(this, "__customCallbackFns")) {
-          this.__customCallbackFns = /* @__PURE__ */ new Map();
-        }
+        this.__customCallbackFns = /* @__PURE__ */ new Map();
         for (const attr of this.attributes) {
           this.#attrSignals[attr.name] = createSignal(attr.value);
         }
@@ -992,7 +979,6 @@ You must set an initial value before calling a property signal's getter.
           { cause: error }
         );
         console.error(_error);
-        throw _error;
       }
     }
     connectedCallback() {
@@ -1018,12 +1004,10 @@ You must set an initial value before calling a property signal's getter.
       }
       for (const attrName of Object.keys(this.#attrSignals)) {
         const signal = this.#attrSignals[attrName];
-        if (signal) {
-          const [getter, setter] = signal;
-          const currentValue = this.getAttribute(attrName);
-          if (getter() !== currentValue) {
-            setter(currentValue);
-          }
+        const [getter, setter] = signal;
+        const currentValue = this.getAttribute(attrName);
+        if (getter() !== currentValue) {
+          setter(currentValue);
         }
       }
       if (this.#observer !== null) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "thunderous",
-  "version": "2.4.5",
+  "version": "2.4.6",
   "description": "A lightweight, functional web components library that brings the power of signals to your UI.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -15,7 +15,8 @@
   "author": "Jonathan DeWitt <jon.dewitt@thunder.solutions>",
   "repository": {
     "type": "git",
-    "url": "https://github.com/Thunder-Solutions/Thunderous"
+    "url": "https://github.com/Thunder-Solutions/Thunderous",
+    "directory": "packages/thunderous"
   },
   "keywords": [
     "thunderous",
@@ -27,7 +28,7 @@
   "bugs": {
     "url": "https://github.com/Thunder-Solutions/Thunderous/issues"
   },
-  "homepage": "https://github.com/Thunder-Solutions/Thunderous#readme",
+  "homepage": "https://thunderous.dev",
   "license": "MIT",
   "peerDependencies": {
     "@webcomponents/scoped-custom-element-registry": "^0.0.10"
@@ -37,19 +38,29 @@
       "optional": true
     }
   },
+  "devDependencies": {
+    "@playwright/test": "^1.58.2",
+    "@vitest/browser": "^4.1.4",
+    "@vitest/browser-playwright": "^4.1.4",
+    "@vitest/coverage-istanbul": "^4.1.4",
+    "istanbul-merge": "^2.0.0",
+    "nyc": "^18.0.0",
+    "vitest": "^4.1.4"
+  },
   "scripts": {
     "demo": "cd demo && npm start",
-    "demo:ssr": "cd demo && npm run ssr",
+    "demo:ssr": "cd demo && pnpm ssr",
     "build": "tsup src/index.ts --format cjs,esm --dts --no-clean",
-    "test": "npm run test:server && npm run test:client",
-    "test:server": "find src/__test__/server -name '*.test.ts' | xargs c8 tsx --test",
-    "test:client": "PLAYWRIGHT_BROWSERS_PATH=../../.browsers playwright test",
+    "clean": "rm -rf dist",
+    "test": "pnpm test:server & pnpm test:client && pnpm coverage",
+    "test:server": "vitest run --config vitest.server.config.ts --coverage",
+    "test:client": "vitest run --config vitest.client.config.ts --coverage",
+    "coverage": "istanbul-merge --out ./coverage/merged/coverage-final.json ./coverage/server/coverage-final.json ./coverage/client/coverage-final.json && nyc report && nyc check-coverage",
     "typecheck": "tsc --noEmit",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
     "format": "prettier --check . --ignore-path ../../.gitignore",
     "format:fix": "prettier --write . --ignore-path ../../.gitignore",
-    "preversion": "npm run typecheck && npm run lint && npm test && npm run build",
     "version": "node postversion.js"
   }
 }