leanweb 3.0.6 → 3.0.8

package/commands/build.js

@@ -45,34 +45,38 @@ const buildModule = (projectPath) => {
   };
 
   const buildHTML = () => {
-    project.components.forEach(cmp => {
-      const cmpName = utils.getComponentName(cmp);
-      const htmlFilename = `${utils.dirs.build}/components/${cmp}/${cmpName}.html`;
-      const htmlFileExists = fs.existsSync(htmlFilename);
-      if (htmlFileExists) {
-        const cssFilename = `${utils.dirs.build}/components/${cmp}/${cmpName}.css`;
-        const cssFileExists = fs.existsSync(cssFilename);
-        let cssString = `@import "global-styles.css";\n`;
-        if (cssFileExists) {
-          cssString += fs.readFileSync(cssFilename, 'utf8');
+    try {
+      project.components.forEach(cmp => {
+        const cmpName = utils.getComponentName(cmp);
+        const htmlFilename = `${utils.dirs.build}/components/${cmp}/${cmpName}.html`;
+        const htmlFileExists = fs.existsSync(htmlFilename);
+        if (htmlFileExists) {
+          const cssFilename = `${utils.dirs.build}/components/${cmp}/${cmpName}.css`;
+          const cssFileExists = fs.existsSync(cssFilename);
+          let cssString = `@import "global-styles.css";\n`;
+          if (cssFileExists) {
+            cssString += fs.readFileSync(cssFilename, 'utf8');
+          }
+          cssString += '\n[lw-false],[lw-for]{display:none !important;}\n';
+          const htmlString = fs.readFileSync(htmlFilename, 'utf8');
+          const minifiedHtml = minify(htmlString, {
+            caseSensitive: true,
+            collapseWhitespace: true,
+            minifyCSS: true,
+            minifyJS: true,
+            removeComments: true,
+          });
+          const ast = parser.parse(minifiedHtml);
+          ast.css = cssString;
+          ast.componentFullName = project.name + '-' + cmp.replace(/\//g, '-');
+          ast.runtimeVersion = project.version;
+          ast.builderVersion = leanwebPackageJSON.version;
+          utils.writeIfChanged(`${utils.dirs.build}/components/${cmp}/ast.js`, `export default ${JSON.stringify(ast, null, 0)};`);
         }
-        cssString += '\n[lw-false],[lw-for]{display:none !important;}\n';
-        const htmlString = fs.readFileSync(htmlFilename, 'utf8');
-        const minifiedHtml = minify(htmlString, {
-          caseSensitive: true,
-          collapseWhitespace: true,
-          minifyCSS: true,
-          minifyJS: true,
-          removeComments: true,
-        });
-        const ast = parser.parse(minifiedHtml);
-        ast.css = cssString;
-        ast.componentFullName = project.name + '-' + cmp.replace(/\//g, '-');
-        ast.runtimeVersion = project.version;
-        ast.builderVersion = leanwebPackageJSON.version;
-        utils.writeIfChanged(`${utils.dirs.build}/components/${cmp}/ast.js`, `export default ${JSON.stringify(ast, null, 0)};`);
-      }
-    });
+      });
+    } catch (e) {
+      console.error('Error in buildHTML:', e);
+    }
   };
 
   copySrc();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "leanweb",
-  "version": "3.0.6",
+  "version": "3.0.8",
   "description": "Builds framework agnostic web components.",
   "bin": {
     "leanweb": "leanweb.js",
@@ -20,12 +20,12 @@
   "author": "Qian Chen",
   "license": "MIT",
   "dependencies": {
-    "@babel/parser": "^7.28.3",
+    "@babel/parser": "^7.28.4",
     "esbuild": "^0.25.9",
     "fs-extra": "^11.3.1",
     "globby": "^14.1.0",
     "html-minifier": "^4.0.0",
-    "isomorphic-git": "^1.33.0",
+    "isomorphic-git": "^1.33.1",
     "live-server": "^1.2.2",
     "node-watch": "^0.7.4",
     "parse5": "^8.0.0",

package/templates/lib/lw-element.js

@@ -111,10 +111,14 @@ export default class LWElement extends HTMLElement {
 
     this._bindMethods();
     setTimeout(() => {
-      this.update(this.shadowRoot);
-      setTimeout(() => {
-        this.domReady?.call(this);
-      });
+      const result = this.domReady?.call(this);
+      if (result && typeof result.then === 'function') {
+        // domReady is async
+        result.then(() => this.update());
+      } else {
+        // domReady is sync
+        this.update();
+      }
     });
 
     if (this.urlHashChanged && typeof this.urlHashChanged === 'function') {
@@ -286,7 +290,9 @@ export default class LWElement extends HTMLElement {
       } else if (modelNode.type === 'checkbox') {
         if (Array.isArray(object[propertyExpr])) {
           if (modelNode.checked) {
-            object[propertyExpr].push(modelNode.value);
+            if (!object[propertyExpr].includes(modelNode.value)) {
+              object[propertyExpr].push(modelNode.value);
+            }
           } else {
             const index = object[propertyExpr].indexOf(modelNode.value);
             if (index > -1) {
@@ -335,9 +341,14 @@ export default class LWElement extends HTMLElement {
     } else if (modelNode.type === 'radio') {
       modelNode.checked = parsed[0] === modelNode.value;
     } else if (modelNode.type === 'select-multiple') {
+      // First, clear all selections
       for (let i = 0; i < modelNode.options.length; ++i) {
-        const option = modelNode.options[i];
-        if (parsed[0]) {
+        modelNode.options[i].selected = false;
+      }
+      // Then, set selected options
+      if (parsed[0]) {
+        for (let i = 0; i < modelNode.options.length; ++i) {
+          const option = modelNode.options[i];
           option.selected = parsed[0].includes(option.value);
         }
       }
@@ -419,11 +430,20 @@ export default class LWElement extends HTMLElement {
         const parsed = parser.evaluate(interpolation.ast, context, interpolation.loc);
 
         if (interpolation.lwValue === 'class') {
-          const initClass = bindNode.getAttribute('lw-init-class');
-          if (!parsed[0]) {
-            bindNode.classList.remove(parsed[0]);
-          } else {
-            bindNode.classList = initClass + ' ' + parsed[0];
+          const dynamicClass = parsed[0];
+          const initClass = bindNode.getAttribute('lw-init-class') || '';
+          // Ensure initial classes are present
+          if (initClass) {
+            initClass.split(' ').forEach(cls => {
+              if (cls) bindNode.classList.add(cls);
+            });
+          }
+          // Add or remove the dynamic class
+          if (dynamicClass) {
+            bindNode.classList.add(dynamicClass);
+          } else if (dynamicClass !== undefined) {
+            // Only remove if not undefined (so we don't remove all classes accidentally)
+            bindNode.classList.remove(dynamicClass);
           }
         } else {
           if (parsed[0] !== false && parsed[0] !== undefined && parsed[0] !== null) {

package/templates/lib/lw-expr-parser.js

@@ -96,14 +96,35 @@ const nodeHandlers = {
   'ExpressionStatement': (node, context) => evalNode(node.expression, context),
   'BinaryExpression': (node, context) => binaryOperations[node.operator](evalNode(node.left, context), evalNode(node.right, context)),
   'AssignmentExpression': (node, context) => {
-    const immediateCtx = immediateContext(node.left, context);
-    assignmentOperations[node.operator](immediateCtx, node.left.name, evalNode(node.right, context));
+    // Support complex left-hand sides (e.g., obj.prop = 1, obj[expr] = 1)
+    let obj, prop;
+    if (node.left.type === 'MemberExpression' || node.left.type === 'OptionalMemberExpression') {
+      obj = evalNode(node.left.object, context);
+      prop = node.left.computed ? evalNode(node.left.property, context) : node.left.property.name;
+    } else if (node.left.type === 'Identifier') {
+      // Simple variable assignment
+      obj = immediateContext(node.left, context);
+      prop = node.left.name;
+    } else {
+      throw new Error('Unsupported assignment left-hand side');
+    }
+    assignmentOperations[node.operator](obj, prop, evalNode(node.right, context));
   },
   'LogicalExpression': (node, context) => logicalOperators[node.operator](evalNode(node.left, context), evalNode(node.right, context)),
   'UnaryExpression': (node, context) => unaryOperators[node.operator](evalNode(node.argument, context)),
   'UpdateExpression': (node, context) => {
-    const immediateCtx = immediateContext(node.argument, context);
-    updateOperators(node.operator, node.prefix)(immediateCtx, node.argument.name, evalNode(node.argument, context));
+    // Support complex left-hand sides (e.g., ++obj.prop, ++obj[expr])
+    let obj, prop;
+    if (node.argument.type === 'MemberExpression' || node.argument.type === 'OptionalMemberExpression') {
+      obj = evalNode(node.argument.object, context);
+      prop = node.argument.computed ? evalNode(node.argument.property, context) : node.argument.property.name;
+    } else if (node.argument.type === 'Identifier') {
+      obj = immediateContext(node.argument, context);
+      prop = node.argument.name;
+    } else {
+      throw new Error('Unsupported update left-hand side');
+    }
+    return updateOperators(node.operator, node.prefix)(obj, prop);
   },
   'ConditionalExpression': (node, context) => {
     const test = evalNode(node.test, context);