@getforma/core 1.0.3 → 1.0.5

package/README.md

@@ -812,18 +812,28 @@ See the [`examples/`](./examples) directory:
 
 ---
 
-## Ecosystem
+## Part of the Forma Stack
 
-FormaJS is the reactive frontend layer of a full-stack Rust + TypeScript framework.
+### Frontend (TypeScript)
 
-| Package | Language | Description |
-|---|---|---|
-| [@getforma/core](https://www.npmjs.com/package/@getforma/core) | TypeScript | This library — reactive DOM, signals, islands, SSR hydration |
-| [@getforma/compiler](https://github.com/getforma-dev/forma-tools) | TypeScript | TypeScript-to-FMIR compiler, Vite plugin, esbuild SSR plugin |
-| [@getforma/build](https://github.com/getforma-dev/forma-tools) | TypeScript | esbuild pipeline with content hashing, compression, manifest |
-| [@getforma/create-app](https://github.com/getforma-dev/create-forma-app) | TypeScript | `npx @getforma/create-app` — scaffold a new Forma project |
-| [forma-ir](https://crates.io/crates/forma-ir) | Rust | FMIR binary format: parser, walker, WASM exports |
-| [forma-server](https://crates.io/crates/forma-server) | Rust | Axum middleware for SSR, asset serving, CSP |
+| Package | Description |
+|---|---|
+| [@getforma/core](https://www.npmjs.com/package/@getforma/core) | **This library** — reactive DOM, signals, islands, SSR hydration |
+| [@getforma/compiler](https://www.npmjs.com/package/@getforma/compiler) | Vite plugin — h() optimization, server function transforms, FMIR emission |
+| [@getforma/build](https://www.npmjs.com/package/@getforma/build) | Production pipeline — esbuild bundling, content hashing, compression, manifest |
+
+### Backend (Rust)
+
+| Package | Description |
+|---|---|
+| [forma-ir](https://crates.io/crates/forma-ir) | FMIR binary format — parser, walker, WASM exports |
+| [forma-server](https://crates.io/crates/forma-server) | Axum middleware — SSR page rendering, asset serving, CSP headers |
+
+### Full Framework
+
+| Package | Description |
+|---|---|
+| [@getforma/create-app](https://github.com/getforma-dev/create-forma-app) | `npx @getforma/create-app` — scaffolds a Rust server + TypeScript frontend project |
 
 ---
 

package/dist/formajs.global.js

@@ -85,6 +85,8 @@ var FormaJS = (() => {
     setStyle: () => setStyle,
     setText: () => setText,
     siblings: () => siblings,
+    template: () => template,
+    templateMany: () => templateMany,
     toggleClass: () => toggleClass,
     trackDisposer: () => trackDisposer,
     trigger: () => trigger,
@@ -1253,7 +1255,7 @@ var FormaJS = (() => {
     const fragment2 = document.createDocumentFragment();
     fragment2.appendChild(startMarker);
     fragment2.appendChild(endMarker);
-    let cache = /* @__PURE__ */ new Map();
+    let cache2 = /* @__PURE__ */ new Map();
     let currentNodes = [];
     let currentItems = [];
     const updateOnItemChange = options?.updateOnItemChange ?? "none";
@@ -1270,7 +1272,7 @@ var FormaJS = (() => {
         for (const node of currentNodes) {
           if (node.parentNode === parent2) parent2.removeChild(node);
         }
-        cache = /* @__PURE__ */ new Map();
+        cache2 = /* @__PURE__ */ new Map();
         currentNodes = [];
         currentItems = [];
         return;
@@ -1294,7 +1296,7 @@ var FormaJS = (() => {
       }
       const updateRow = updateOnItemChange === "rerender" ? (node, item) => {
         const key = keyFn(item);
-        const cached = cache.get(key);
+        const cached = cache2.get(key);
         if (!cached) return;
         if (cached.item === item) return;
         cached.item = item;
@@ -1309,7 +1311,7 @@ var FormaJS = (() => {
         }
       } : (_node, item) => {
         const key = keyFn(item);
-        const cached = cache.get(key);
+        const cached = cache2.get(key);
         if (cached) cached.item = item;
       };
       const result = reconcileList(
@@ -1323,7 +1325,7 @@ var FormaJS = (() => {
           const key = keyFn(item);
           const [getIndex, setIndex] = createSignal(0);
           const element = untrack(() => renderFn(item, getIndex));
-          cache.set(key, { element, item, getIndex, setIndex });
+          cache2.set(key, { element, item, getIndex, setIndex });
           return element;
         },
         updateRow,
@@ -1333,13 +1335,13 @@ var FormaJS = (() => {
       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 = cache2.get(key);
         if (cached) {
           cached.setIndex(i);
           newCache.set(key, cached);
         }
       }
-      cache = newCache;
+      cache2 = newCache;
       currentNodes = result.nodes;
       currentItems = result.items;
     });
@@ -1746,12 +1748,12 @@ var FormaJS = (() => {
             for (const adoptedNode of adoptedNodes) {
               parent2.insertBefore(adoptedNode, end);
             }
-            let cache = /* @__PURE__ */ new Map();
+            let cache2 = /* @__PURE__ */ new Map();
             for (let i = 0; i < adoptedItems.length; i++) {
               const item = adoptedItems[i];
               const key = listKeyFn(item);
               const [getIndex, setIndex] = createSignal(i);
-              cache.set(key, {
+              cache2.set(key, {
                 element: adoptedNodes[i],
                 item,
                 getIndex,
@@ -1777,7 +1779,7 @@ var FormaJS = (() => {
                     const key = listKeyFn(item);
                     const [getIndex, setIndex] = createSignal(0);
                     const element = untrack(() => listRenderFn(item, getIndex));
-                    cache.set(key, { element, item, getIndex, setIndex });
+                    cache2.set(key, { element, item, getIndex, setIndex });
                     return element;
                   } finally {
                     hydrating = prevHydrating;
@@ -1785,7 +1787,7 @@ var FormaJS = (() => {
                 },
                 (_node, item) => {
                   const key = listKeyFn(item);
-                  const cached = cache.get(key);
+                  const cached = cache2.get(key);
                   if (cached) cached.item = item;
                 },
                 end
@@ -1793,13 +1795,13 @@ var FormaJS = (() => {
               const newCache = /* @__PURE__ */ new Map();
               for (let i = 0; i < newItems.length; i++) {
                 const key = listKeyFn(newItems[i]);
-                const cached = cache.get(key);
+                const cached = cache2.get(key);
                 if (cached) {
                   cached.setIndex(i);
                   newCache.set(key, cached);
                 }
               }
-              cache = newCache;
+              cache2 = newCache;
               reconcileNodes = result.nodes;
               reconcileItems = result.items;
             });
@@ -2073,9 +2075,9 @@ var FormaJS = (() => {
     if (typeof value2 === "function") {
       internalEffect(() => {
         const v = value2();
-        const cache = getCache(el);
-        if (cache["class"] === v) return;
-        cache["class"] = v;
+        const cache2 = getCache(el);
+        if (cache2["class"] === v) return;
+        cache2["class"] = v;
         if (el instanceof HTMLElement) {
           el.className = v;
         } else {
@@ -2083,9 +2085,9 @@ var FormaJS = (() => {
         }
       });
     } else {
-      const cache = getCache(el);
-      if (cache["class"] === value2) return;
-      cache["class"] = value2;
+      const cache2 = getCache(el);
+      if (cache2["class"] === value2) return;
+      cache2["class"] = value2;
       if (el instanceof HTMLElement) {
         el.className = value2;
       } else {
@@ -2099,9 +2101,9 @@ var FormaJS = (() => {
       internalEffect(() => {
         const v = value2();
         if (typeof v === "string") {
-          const cache = getCache(el);
-          if (cache["style"] === v) return;
-          cache["style"] = v;
+          const cache2 = getCache(el);
+          if (cache2["style"] === v) return;
+          cache2["style"] = v;
           prevKeys = [];
           el.style.cssText = v;
         } else if (v && typeof v === "object") {
@@ -2117,9 +2119,9 @@ var FormaJS = (() => {
         }
       });
     } else if (typeof value2 === "string") {
-      const cache = getCache(el);
-      if (cache["style"] === value2) return;
-      cache["style"] = value2;
+      const cache2 = getCache(el);
+      if (cache2["style"] === value2) return;
+      cache2["style"] = value2;
       el.style.cssText = value2;
     } else if (value2 && typeof value2 === "object") {
       Object.assign(el.style, value2);
@@ -2152,9 +2154,9 @@ var FormaJS = (() => {
             "dangerouslySetInnerHTML: __html must be a string, got " + typeof html
           );
         }
-        const cache = getCache(el);
-        if (cache["innerHTML"] === html) return;
-        cache["innerHTML"] = html;
+        const cache2 = getCache(el);
+        if (cache2["innerHTML"] === html) return;
+        cache2["innerHTML"] = html;
         el.innerHTML = html;
       });
     } else {
@@ -2199,9 +2201,9 @@ var FormaJS = (() => {
     if (typeof value2 === "function") {
       internalEffect(() => {
         const v = value2();
-        const cache = getCache(el);
-        if (cache[key] === v) return;
-        cache[key] = v;
+        const cache2 = getCache(el);
+        if (cache2[key] === v) return;
+        cache2[key] = v;
         if (v) {
           el.setAttribute(key, "");
         } else {
@@ -2209,9 +2211,9 @@ var FormaJS = (() => {
         }
       });
     } else {
-      const cache = getCache(el);
-      if (cache[key] === value2) return;
-      cache[key] = value2;
+      const cache2 = getCache(el);
+      if (cache2[key] === value2) return;
+      cache2[key] = value2;
       if (value2) {
         el.setAttribute(key, "");
       } else {
@@ -2224,29 +2226,29 @@ var FormaJS = (() => {
       internalEffect(() => {
         const v = value2();
         if (v == null || v === false) {
-          const cache = getCache(el);
-          if (cache[key] === null) return;
-          cache[key] = null;
+          const cache2 = getCache(el);
+          if (cache2[key] === null) return;
+          cache2[key] = null;
           el.removeAttribute(key);
         } else {
           const strVal = String(v);
-          const cache = getCache(el);
-          if (cache[key] === strVal) return;
-          cache[key] = strVal;
+          const cache2 = getCache(el);
+          if (cache2[key] === strVal) return;
+          cache2[key] = strVal;
           el.setAttribute(key, strVal);
         }
       });
     } else {
       if (value2 == null || value2 === false) {
-        const cache = getCache(el);
-        if (cache[key] === null) return;
-        cache[key] = null;
+        const cache2 = getCache(el);
+        if (cache2[key] === null) return;
+        cache2[key] = null;
         el.removeAttribute(key);
       } else {
         const strVal = String(value2);
-        const cache = getCache(el);
-        if (cache[key] === strVal) return;
-        cache[key] = strVal;
+        const cache2 = getCache(el);
+        if (cache2[key] === strVal) return;
+        cache2[key] = strVal;
         el.setAttribute(key, strVal);
       }
     }
@@ -2497,7 +2499,7 @@ var FormaJS = (() => {
     const fragment2 = document.createDocumentFragment();
     fragment2.appendChild(startMarker);
     fragment2.appendChild(endMarker);
-    const cache = /* @__PURE__ */ new Map();
+    const cache2 = /* @__PURE__ */ new Map();
     let currentNode = null;
     let currentMatch = UNSET;
     const switchDispose = internalEffect(() => {
@@ -2532,7 +2534,7 @@ var FormaJS = (() => {
       }
       const matchedCase = cases.find((c) => c.match === val);
       if (matchedCase) {
-        let entry = cache.get(val);
+        let entry = cache2.get(val);
         if (!entry) {
           let branchDispose;
           const node = createRoot((dispose) => {
@@ -2540,7 +2542,7 @@ var FormaJS = (() => {
             return untrack(() => matchedCase.render());
           });
           entry = { node, dispose: branchDispose };
-          cache.set(val, entry);
+          cache2.set(val, entry);
           if (DEBUG) console.log("[forma:switch] rendered new branch for", String(val), "\u2192", node.nodeName, "type", node.nodeType);
         } else {
           if (DEBUG) console.log("[forma:switch] reusing cached branch for", String(val), "\u2192", entry.node.nodeName, "type", entry.node.nodeType, "childNodes", entry.node.childNodes?.length);
@@ -2557,10 +2559,10 @@ var FormaJS = (() => {
     });
     fragment2.__switchDispose = () => {
       switchDispose();
-      for (const entry of cache.values()) {
+      for (const entry of cache2.values()) {
         entry.dispose();
       }
-      cache.clear();
+      cache2.clear();
     };
     return fragment2;
   }
@@ -2664,6 +2666,29 @@ var FormaJS = (() => {
     return fragment2;
   }
 
+  // src/dom/template.ts
+  var cache = /* @__PURE__ */ new Map();
+  function template(html) {
+    let node = cache.get(html);
+    if (!node) {
+      const tpl = document.createElement("template");
+      tpl.innerHTML = html;
+      node = tpl.content.firstChild;
+      cache.set(html, node);
+    }
+    return node;
+  }
+  function templateMany(html) {
+    let node = cache.get(html);
+    if (!node) {
+      const tpl = document.createElement("template");
+      tpl.innerHTML = html;
+      node = tpl.content;
+      cache.set(html, node);
+    }
+    return node.cloneNode(true);
+  }
+
   // src/dom/activate.ts
   var FORBIDDEN_PROP_KEYS = /* @__PURE__ */ new Set(["__proto__", "constructor", "prototype"]);
   function sanitizeProps(obj) {