@getforma/core 1.0.8 → 1.0.9

package/dist/{chunk-7L3KHGEA.cjs → chunk-T33QUD2Y.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkBARF67I6_cjs = require('./chunk-BARF67I6.cjs');
+var chunk6FW5E54W_cjs = require('./chunk-6FW5E54W.cjs');
 var chunkQLPCVK7C_cjs = require('./chunk-QLPCVK7C.cjs');
 
 // src/dom/element.ts
@@ -156,7 +156,7 @@ function getCache(el) {
 }
 function handleClass(el, _key, value) {
   if (typeof value === "function") {
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const v = value();
       const cache = getCache(el);
       if (cache["class"] === v) return;
@@ -178,34 +178,50 @@ function handleClass(el, _key, value) {
     }
   }
 }
+function parseCssString(css) {
+  const obj = {};
+  for (const decl of css.split(";")) {
+    const colon = decl.indexOf(":");
+    if (colon < 0) continue;
+    const prop = decl.slice(0, colon).trim();
+    const val = decl.slice(colon + 1).trim();
+    if (prop && val) {
+      const camel = prop.replace(/-([a-z])/g, (_, c) => c.toUpperCase());
+      obj[camel] = val;
+    }
+  }
+  return obj;
+}
+function applyStyleObj(el, obj, prevKeys) {
+  const style = el.style;
+  const nextKeys = Object.keys(obj);
+  for (const k of prevKeys) {
+    if (!(k in obj)) {
+      style.removeProperty(k.replace(/[A-Z]/g, (c) => "-" + c.toLowerCase()));
+    }
+  }
+  Object.assign(style, obj);
+  return nextKeys;
+}
 function handleStyle(el, _key, value) {
   if (typeof value === "function") {
     let prevKeys = [];
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const v = value();
       if (typeof v === "string") {
         const cache = getCache(el);
         if (cache["style"] === v) return;
         cache["style"] = v;
-        prevKeys = [];
-        el.style.cssText = v;
+        prevKeys = applyStyleObj(el, parseCssString(v), prevKeys);
       } else if (v && typeof v === "object") {
-        const style = el.style;
-        const nextKeys = Object.keys(v);
-        for (const k of prevKeys) {
-          if (!(k in v)) {
-            style.removeProperty(k.replace(/[A-Z]/g, (c) => "-" + c.toLowerCase()));
-          }
-        }
-        Object.assign(style, v);
-        prevKeys = nextKeys;
+        prevKeys = applyStyleObj(el, v, prevKeys);
       }
     });
   } else if (typeof value === "string") {
     const cache = getCache(el);
     if (cache["style"] === value) return;
     cache["style"] = value;
-    el.style.cssText = value;
+    applyStyleObj(el, parseCssString(value), []);
   } else if (value && typeof value === "object") {
     Object.assign(el.style, value);
   }
@@ -220,7 +236,7 @@ function handleEvent(el, key, value) {
 }
 function handleInnerHTML(el, _key, value) {
   if (typeof value === "function") {
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const resolved = value();
       if (resolved == null) {
         el.innerHTML = "";
@@ -264,7 +280,7 @@ function handleInnerHTML(el, _key, value) {
 function handleXLink(el, key, value) {
   const localName = key.slice(6);
   if (typeof value === "function") {
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const v = value();
       if (v == null || v === false) {
         el.removeAttributeNS(XLINK_NS, localName);
@@ -282,7 +298,7 @@ function handleXLink(el, key, value) {
 }
 function handleBooleanAttr(el, key, value) {
   if (typeof value === "function") {
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const v = value();
       const cache = getCache(el);
       if (cache[key] === v) return;
@@ -306,7 +322,7 @@ function handleBooleanAttr(el, key, value) {
 }
 function handleGenericAttr(el, key, value) {
   if (typeof value === "function") {
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const v = value();
       if (v == null || v === false) {
         const cache = getCache(el);
@@ -378,7 +394,7 @@ function applyStaticProp(el, key, value) {
   }
   if (key === "style") {
     if (typeof value === "string") {
-      el.style.cssText = value;
+      applyStyleObj(el, parseCssString(value), []);
     } else if (value && typeof value === "object") {
       Object.assign(el.style, value);
     }
@@ -449,7 +465,7 @@ function appendChild(parent, child) {
       }
       currentNode = null;
     };
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const v = child();
       let resolved = v;
       if (Array.isArray(v)) {
@@ -599,7 +615,7 @@ function createShow(when, thenFn, elseFn = () => null) {
   let currentNode = null;
   let lastTruthy = null;
   let currentDispose = null;
-  const showDispose = chunkBARF67I6_cjs.internalEffect(() => {
+  const showDispose = chunk6FW5E54W_cjs.internalEffect(() => {
     const truthy = !!when();
     const DEBUG = typeof globalThis.__FORMA_DEBUG__ !== "undefined";
     const DEBUG_LABEL = DEBUG ? thenFn.toString().slice(0, 60) : "";
@@ -631,9 +647,9 @@ function createShow(when, thenFn, elseFn = () => null) {
     const branchFn = truthy ? thenFn : elseFn;
     if (branchFn) {
       let branchDispose;
-      currentNode = chunkBARF67I6_cjs.createRoot((dispose) => {
+      currentNode = chunk6FW5E54W_cjs.createRoot((dispose) => {
         branchDispose = dispose;
-        return chunkBARF67I6_cjs.untrack(() => branchFn());
+        return chunk6FW5E54W_cjs.untrack(() => branchFn());
       });
       currentDispose = branchDispose;
     } else {
@@ -643,6 +659,13 @@ function createShow(when, thenFn, elseFn = () => null) {
       parent.insertBefore(currentNode, endMarker);
     }
   });
+  chunk6FW5E54W_cjs.registerDisposer(() => {
+    if (currentDispose) {
+      currentDispose();
+      currentDispose = null;
+    }
+    currentNode = null;
+  });
   fragment2.__showDispose = () => {
     showDispose();
     if (currentDispose) {
@@ -684,7 +707,7 @@ function applyDynamicProps(el, props) {
     }
     const fn = value;
     const attrKey = key;
-    chunkBARF67I6_cjs.internalEffect(() => {
+    chunk6FW5E54W_cjs.internalEffect(() => {
       const v = fn();
       if (v === false || v == null) {
         el.removeAttribute(attrKey);
@@ -796,13 +819,13 @@ function setupShowEffect(desc, marker) {
   let elseFragment = null;
   const hasSSRContent = marker.start.nextSibling !== marker.end;
   if (!hasSSRContent && currentCondition) {
-    if (chunkBARF67I6_cjs.__DEV__) console.warn("[forma] Hydration: show condition mismatch \u2014 SSR empty but client condition is true");
+    if (chunk6FW5E54W_cjs.__DEV__) console.warn("[forma] Hydration: show condition mismatch \u2014 SSR empty but client condition is true");
     const trueBranch = desc.whenTrue();
     if (trueBranch instanceof Node) {
       marker.start.parentNode.insertBefore(trueBranch, marker.end);
     }
   }
-  chunkBARF67I6_cjs.internalEffect(() => {
+  chunk6FW5E54W_cjs.internalEffect(() => {
     const next = !!desc.condition();
     if (next === currentCondition) return;
     currentCondition = next;
@@ -849,7 +872,7 @@ function adoptBranchContent(desc, regionStart, regionEnd) {
 }
 function adoptNode(desc, ssrEl) {
   if (!ssrEl || ssrEl.tagName !== desc.tag.toUpperCase()) {
-    if (chunkBARF67I6_cjs.__DEV__) console.warn(`Hydration mismatch: expected <${desc.tag}>, got <${ssrEl?.tagName?.toLowerCase() ?? "nothing"}>`);
+    if (chunk6FW5E54W_cjs.__DEV__) console.warn(`Hydration mismatch: expected <${desc.tag}>, got <${ssrEl?.tagName?.toLowerCase() ?? "nothing"}>`);
     const fresh = descriptorToElement(desc);
     if (ssrEl) ssrEl.replaceWith(fresh);
     return;
@@ -923,7 +946,7 @@ function adoptNode(desc, ssrEl) {
             }
             node = node.nextSibling;
           }
-          const currentItems = chunkBARF67I6_cjs.untrack(() => child.items());
+          const currentItems = chunk6FW5E54W_cjs.untrack(() => child.items());
           const listKeyFn = child.keyFn;
           const listRenderFn = child.renderFn;
           const useIndexFallback = ssrKeyMap.size === 0 && ssrElements.length > 0;
@@ -947,7 +970,7 @@ function adoptNode(desc, ssrEl) {
               adoptedNodes.push(ssrNode);
               adoptedItems.push(item);
             } else {
-              if (chunkBARF67I6_cjs.__DEV__) console.warn(`[FormaJS] Hydration: list item key "${key}" not found in SSR \u2014 rendering fresh`);
+              if (chunk6FW5E54W_cjs.__DEV__) console.warn(`[FormaJS] Hydration: list item key "${key}" not found in SSR \u2014 rendering fresh`);
               const prevHydrating = hydrating;
               hydrating = false;
               try {
@@ -969,7 +992,7 @@ function adoptNode(desc, ssrEl) {
             }
           } else {
             for (const [unusedKey, unusedNode] of ssrKeyMap) {
-              if (chunkBARF67I6_cjs.__DEV__) console.warn(`[FormaJS] Hydration: removing extra SSR list item with key "${unusedKey}"`);
+              if (chunk6FW5E54W_cjs.__DEV__) console.warn(`[FormaJS] Hydration: removing extra SSR list item with key "${unusedKey}"`);
               if (unusedNode.parentNode) {
                 unusedNode.parentNode.removeChild(unusedNode);
               }
@@ -993,7 +1016,7 @@ function adoptNode(desc, ssrEl) {
           }
           let reconcileNodes = adoptedNodes.slice();
           let reconcileItems = adoptedItems.slice();
-          chunkBARF67I6_cjs.internalEffect(() => {
+          chunk6FW5E54W_cjs.internalEffect(() => {
             const newItems = child.items();
             const parent2 = start.parentNode;
             if (!parent2) return;
@@ -1009,7 +1032,7 @@ function adoptNode(desc, ssrEl) {
                 try {
                   const key = listKeyFn(item);
                   const [getIndex, setIndex] = chunkQLPCVK7C_cjs.createSignal(0);
-                  const element = chunkBARF67I6_cjs.untrack(() => listRenderFn(item, getIndex));
+                  const element = chunk6FW5E54W_cjs.untrack(() => listRenderFn(item, getIndex));
                   cache.set(key, { element, item, getIndex, setIndex });
                   return element;
                 } finally {
@@ -1058,12 +1081,12 @@ function adoptNode(desc, ssrEl) {
           const endMarker = findClosingMarker(cursor);
           let textNode = cursor.nextSibling;
           if (!textNode || textNode.nodeType !== 3) {
-            if (chunkBARF67I6_cjs.__DEV__) console.warn(`[FormaJS] Hydration: created text node for marker ${data} \u2014 SSR walker should emit content between markers`);
+            if (chunk6FW5E54W_cjs.__DEV__) console.warn(`[FormaJS] Hydration: created text node for marker ${data} \u2014 SSR walker should emit content between markers`);
             const created = document.createTextNode("");
             cursor.parentNode.insertBefore(created, endMarker || cursor.nextSibling);
             textNode = created;
           }
-          chunkBARF67I6_cjs.internalEffect(() => {
+          chunk6FW5E54W_cjs.internalEffect(() => {
             textNode.data = String(child());
           });
           cursor = endMarker ? endMarker.nextSibling : textNode.nextSibling;
@@ -1073,11 +1096,11 @@ function adoptNode(desc, ssrEl) {
           if (end) {
             let textNode = findTextBetween(start, end);
             if (!textNode) {
-              if (chunkBARF67I6_cjs.__DEV__) console.warn(`[FormaJS] Hydration: created text node for show marker ${start.data} \u2014 SSR walker should emit content between markers`);
+              if (chunk6FW5E54W_cjs.__DEV__) console.warn(`[FormaJS] Hydration: created text node for show marker ${start.data} \u2014 SSR walker should emit content between markers`);
               textNode = document.createTextNode("");
               start.parentNode.insertBefore(textNode, end);
             }
-            chunkBARF67I6_cjs.internalEffect(() => {
+            chunk6FW5E54W_cjs.internalEffect(() => {
               textNode.data = String(child());
             });
             cursor = end.nextSibling;
@@ -1090,14 +1113,14 @@ function adoptNode(desc, ssrEl) {
       } else if (cursor && cursor.nodeType === 3) {
         const textNode = cursor;
         cursor = cursor.nextSibling;
-        chunkBARF67I6_cjs.internalEffect(() => {
+        chunk6FW5E54W_cjs.internalEffect(() => {
           textNode.data = String(child());
         });
       } else {
-        if (chunkBARF67I6_cjs.__DEV__) console.warn(`[FormaJS] Hydration: created text node in empty <${ssrEl.tagName.toLowerCase()}> \u2014 IR may not cover this component`);
+        if (chunk6FW5E54W_cjs.__DEV__) console.warn(`[FormaJS] Hydration: created text node in empty <${ssrEl.tagName.toLowerCase()}> \u2014 IR may not cover this component`);
         const textNode = document.createTextNode("");
         ssrEl.appendChild(textNode);
-        chunkBARF67I6_cjs.internalEffect(() => {
+        chunk6FW5E54W_cjs.internalEffect(() => {
           textNode.data = String(child());
         });
       }
@@ -1111,7 +1134,7 @@ function adoptNode(desc, ssrEl) {
 function hydrateIsland(component, target) {
   const hasSSRContent = target.childElementCount > 0 || target.childNodes.length > 0 && Array.from(target.childNodes).some((n) => n.nodeType === 1 || n.nodeType === 3 && n.data.trim());
   if (!hasSSRContent) {
-    if (chunkBARF67I6_cjs.__DEV__) {
+    if (chunk6FW5E54W_cjs.__DEV__) {
       const name = target.getAttribute("data-forma-component") || "unknown";
       console.warn(
         `[forma] Island "${name}" has no SSR content \u2014 falling back to CSR. This means the IR walker did not render content between ISLAND_START and ISLAND_END.`
@@ -1427,14 +1450,14 @@ function createList(items, keyFn, renderFn, options) {
   let currentNodes = [];
   let currentItems = [];
   const updateOnItemChange = options?.updateOnItemChange ?? "none";
-  chunkBARF67I6_cjs.internalEffect(() => {
+  chunk6FW5E54W_cjs.internalEffect(() => {
     const newItems = items();
     const parent = startMarker.parentNode;
     if (!parent) {
       return;
     }
     if (!Array.isArray(newItems)) {
-      if (chunkBARF67I6_cjs.__DEV__) {
+      if (chunk6FW5E54W_cjs.__DEV__) {
         console.warn("[forma] createList: value is not an array, treating as empty");
       }
       for (const node of currentNodes) {
@@ -1452,7 +1475,7 @@ function createList(items, keyFn, renderFn, options) {
         break;
       }
     }
-    if (chunkBARF67I6_cjs.__DEV__) {
+    if (chunk6FW5E54W_cjs.__DEV__) {
       const seen = /* @__PURE__ */ new Set();
       for (const item of cleanItems) {
         const key = keyFn(item);
@@ -1472,7 +1495,7 @@ function createList(items, keyFn, renderFn, options) {
       if (node[ABORT_SYM3] || node[CACHE_SYM2] || node[DYNAMIC_CHILD_SYM2]) {
         return;
       }
-      const next = chunkBARF67I6_cjs.untrack(() => renderFn(item, cached.getIndex));
+      const next = chunk6FW5E54W_cjs.untrack(() => renderFn(item, cached.getIndex));
       if (canPatchStaticElement(node, next)) {
         patchStaticElement(node, next);
         cached.element = node;
@@ -1482,18 +1505,26 @@ function createList(items, keyFn, renderFn, options) {
       const cached = cache.get(key);
       if (cached) cached.item = item;
     };
+    const oldCache = cache;
     const result = reconcileList(
       parent,
       currentItems,
       cleanItems,
       currentNodes,
       keyFn,
-      // createFn: create element + cache entry
+      // createFn: create element + cache entry.
+      // Each item is rendered inside createRoot + untrack so that inner
+      // effects are owned by the item's root (not the parent), and are
+      // disposed when the item is removed from the list.
       (item) => {
         const key = keyFn(item);
         const [getIndex, setIndex] = chunkQLPCVK7C_cjs.createSignal(0);
-        const element = chunkBARF67I6_cjs.untrack(() => renderFn(item, getIndex));
-        cache.set(key, { element, item, getIndex, setIndex });
+        let itemDispose;
+        const element = chunk6FW5E54W_cjs.createRoot((dispose) => {
+          itemDispose = dispose;
+          return chunk6FW5E54W_cjs.untrack(() => renderFn(item, getIndex));
+        });
+        cache.set(key, { element, item, getIndex, setIndex, dispose: itemDispose });
         return element;
       },
       updateRow,
@@ -1503,16 +1534,29 @@ function createList(items, keyFn, renderFn, options) {
     const newCache = /* @__PURE__ */ new Map();
     for (let i = 0; i < cleanItems.length; i++) {
       const key = keyFn(cleanItems[i]);
-      const cached = cache.get(key);
+      const cached = oldCache.get(key);
       if (cached) {
         cached.setIndex(i);
         newCache.set(key, cached);
       }
     }
+    for (const [key, cached] of oldCache) {
+      if (!newCache.has(key)) {
+        cached.dispose();
+      }
+    }
     cache = newCache;
     currentNodes = result.nodes;
     currentItems = result.items;
   });
+  chunk6FW5E54W_cjs.registerDisposer(() => {
+    for (const cached of cache.values()) {
+      cached.dispose();
+    }
+    cache = /* @__PURE__ */ new Map();
+    currentNodes = [];
+    currentItems = [];
+  });
   return fragment2;
 }
 
@@ -1524,5 +1568,5 @@ exports.fragment = fragment;
 exports.h = h;
 exports.hydrateIsland = hydrateIsland;
 exports.reconcileList = reconcileList;
-//# sourceMappingURL=chunk-7L3KHGEA.cjs.map
-//# sourceMappingURL=chunk-7L3KHGEA.cjs.map
+//# sourceMappingURL=chunk-T33QUD2Y.cjs.map
+//# sourceMappingURL=chunk-T33QUD2Y.cjs.map