@sola-air-ui/compiler 1.5.2 → 1.5.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sola-air-ui/compiler",
-  "version": "1.5.2",
+  "version": "1.5.4",
   "description": "Compiler for Sola single-file components (.sola) \u2014 transforms template + script + style to ES modules",
   "type": "module",
   "main": "./src/index.js",

package/src/check.js

@@ -105,7 +105,7 @@ export function checkSource(source, filename = 'component.sola') {
               add(at, 'error', 'SOLA001', '`{:else if}` is missing a condition. It renders as literal text.');
             }
           } else {
-            add(at, 'error', 'SOLA001', '`{:else}` unexpected token (use `{:else}` or `{:else if <condition>}`). It renders as literal text.');
+            add(at, 'error', 'SOLA001', '`{:else}` has extra text after it (use `{:else}` or `{:else if <condition>}`). It renders as literal text.');
           }
         }
       }

package/src/index.js

@@ -73,9 +73,9 @@ function addScopeToCompound(compound, scopeHash) {
 //   :global(body)        →  body
 // The scope class always goes on the last compound that is not global.
 function scopeSelector(selector, scopeHash) {
-  const tokens = [];       // alternating compounds and combinators
+  const pieces = [];       // alternating compounds and combinators
   let depth = 0, cur = '', comb = '';
-  const flushCompound = () => { if (cur) { tokens.push({ compound: cur }); cur = ''; } };
+  const flushCompound = () => { if (cur) { pieces.push({ compound: cur }); cur = ''; } };
   for (let i = 0; i < selector.length; i++) {
     const c = selector[i];
     if (c === '(' || c === '[') depth++;
@@ -85,15 +85,15 @@ function scopeSelector(selector, scopeHash) {
       comb += c;
       continue;
     }
-    if (comb) { tokens.push({ comb }); comb = ''; }
+    if (comb) { pieces.push({ comb }); comb = ''; }
     cur += c;
   }
   flushCompound();
-  if (comb) tokens.push({ comb });
+  if (comb) pieces.push({ comb });
 
   let last = -1;
-  for (let i = 0; i < tokens.length; i++) {
-    const t = tokens[i];
+  for (let i = 0; i < pieces.length; i++) {
+    const t = pieces[i];
     if (t.compound === undefined) continue;
     const m = t.compound.match(/^:global\(([\s\S]*)\)$/);
     // A comma list must stay grouped, or `.a :global(.x, .y)` would turn into
@@ -105,8 +105,8 @@ function scopeSelector(selector, scopeHash) {
       t.global = true;
     } else { last = i; }
   }
-  if (last >= 0) tokens[last].compound = addScopeToCompound(tokens[last].compound, scopeHash);
-  return tokens.map(t => t.compound ?? t.comb).join('');
+  if (last >= 0) pieces[last].compound = addScopeToCompound(pieces[last].compound, scopeHash);
+  return pieces.map(t => t.compound ?? t.comb).join('');
 }
 
 function scopeSelectorList(selector, scopeHash) {
@@ -1504,12 +1504,24 @@ export function compile(source, options = {}) {
         domCode += `      const _key = String(${keyExpr});\n`;
         domCode += `      _seen.add(_key);\n`;
         domCode += `      let _entry = ${eid}_keyMap.get(_key);\n`;
+        // A row's bindings read the item it was built with. When the list hands
+        // back a different object for the same key (an immutable update such as
+        // items.map(i => i.id === id ? { ...i, done: true } : i)), or the index the
+        // row shows has changed, rebuild that row; rows whose item is the same
+        // object are kept as they are.
+        domCode += `      if (_entry && (_entry.item !== ${node.attribs.item}${node.attribs.index ? ` || _entry.index !== _i` : ''})) {\n`;
+        domCode += `        __flush_destroys(_entry.ctx);\n`;
+        domCode += `        const _old = _entry.nodes;\n`;
+        domCode += `        if (_old.includes(_cursor)) _cursor = _old[_old.length - 1].nextSibling;\n`;
+        domCode += `        _old.forEach(n => n.remove());\n`;
+        domCode += `        _entry = null;\n`;
+        domCode += `      }\n`;
         domCode += `      if (!_entry) {\n`;
         domCode += `        const _kctx = pushContext();\n`;
         domCode += `        try {\n`;
         domCode += `        const f = document.createDocumentFragment();\n`;
         node.children.forEach(child => emitNode(child, 'f', eachLocals, inSvg));
-        domCode += `        _entry = { nodes: Array.from(f.childNodes), ctx: _kctx };\n`;
+        domCode += `        _entry = { nodes: Array.from(f.childNodes), ctx: _kctx, item: ${node.attribs.item}${node.attribs.index ? ', index: _i' : ''} };\n`;
         domCode += `        } finally { popContext(_kctx); }\n`;
         domCode += `        ${eid}_keyMap.set(_key, _entry);\n`;
         domCode += `      }\n`;