leanweb 3.0.7 → 3.0.9

package/commands/init.js

@@ -23,7 +23,7 @@ import * as utils from './utils.js';
     return;
   }
 
-  const projectName = path.basename(path.resolve());
+  let projectName = path.basename(path.resolve());
 
   if (args.length >= 3) {
     projectName = args[2];

package/leanweb.js

@@ -42,7 +42,7 @@ import * as utils from './commands/utils.js';
     return;
   }
 
-  if (leanwebJSONExisted && target === 'version' || target === 'serve' || target === 'dist') {
+  if (leanwebJSONExisted && (target === 'version' || target === 'serve' || target === 'dist')) {
     const leanwebPackageJSON = require(`${__dirname}/package.json`);
     const projectLeanwebJSON = require(`${process.cwd()}/${utils.dirs.src}/leanweb.json`);
     const upgradeAvailable = semver.gt(leanwebPackageJSON.version, projectLeanwebJSON.version);

package/lib/lw-html-parser.js

@@ -6,7 +6,7 @@ let astKey = 0;
 const removeASTLocation = ast => {
   if (Array.isArray(ast)) {
     ast.forEach(a => removeASTLocation(a));
-  } else if (typeof ast === 'object') {
+  } else if (ast !== null && typeof ast === 'object') {
     delete ast['loc'];
     delete ast['start'];
     delete ast['end'];
@@ -77,7 +77,7 @@ const walkNode = (node, interpolation) => {
 
       if (attr.name === 'lw-bind:class') {
         const classAttr = node.attrs.find(a => a.name === 'class');
-        node.attrs.push({ name: 'lw-init-class', value: classAttr.value });
+        node.attrs.push({ name: 'lw-init-class', value: classAttr?.value ?? '' });
       }
 
       const ast = getAST(attr.value);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "leanweb",
-  "version": "3.0.7",
+  "version": "3.0.9",
   "description": "Builds framework agnostic web components.",
   "bin": {
     "leanweb": "leanweb.js",
@@ -20,15 +20,15 @@
   "author": "Qian Chen",
   "license": "MIT",
   "dependencies": {
-    "@babel/parser": "^7.28.4",
-    "esbuild": "^0.25.9",
-    "fs-extra": "^11.3.1",
-    "globby": "^14.1.0",
+    "@babel/parser": "^7.29.0",
+    "esbuild": "^0.27.3",
+    "fs-extra": "^11.3.4",
+    "globby": "^16.1.1",
     "html-minifier": "^4.0.0",
-    "isomorphic-git": "^1.33.1",
+    "isomorphic-git": "^1.37.2",
     "live-server": "^1.2.2",
     "node-watch": "^0.7.4",
     "parse5": "^8.0.0",
-    "semver": "^7.7.2"
+    "semver": "^7.7.4"
   }
 }

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) {
@@ -316,7 +322,7 @@ export default class LWElement extends HTMLElement {
   }
 
   updateModel(modelNode) {
-    if (modelNode.do_not_update && modelNode.type === 'number') {
+    if (modelNode.do_not_update && (modelNode.type === 'number' || modelNode.type === 'range')) {
       return;
     }
     const key = modelNode.getAttribute('lw-model');
@@ -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);
         }
       }
@@ -377,7 +388,7 @@ export default class LWElement extends HTMLElement {
     const parsed = parser.evaluate(interpolation.ast, context, interpolation.loc);
 
     const hasLwFalse = ifNode.hasAttribute('lw-false');
-    if (parsed[0] !== false && parsed[0] !== undefined && parsed[0] !== null) {
+    if (parsed[0]) {
       hasLwFalse && ifNode.removeAttribute('lw-false');
       setTimeout(() => {
         ifNode.turnedOn?.call(ifNode);
@@ -419,11 +430,25 @@ 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]);
+          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);
+            });
+          }
+          // Remove previously applied dynamic class
+          const prevClass = bindNode['lw-prev-class-' + attrValue];
+          if (prevClass && prevClass !== dynamicClass) {
+            bindNode.classList.remove(prevClass);
+          }
+          // Add or record the dynamic class
+          if (dynamicClass) {
+            bindNode.classList.add(dynamicClass);
+            bindNode['lw-prev-class-' + attrValue] = dynamicClass;
           } else {
-            bindNode.classList = initClass + ' ' + parsed[0];
+            bindNode['lw-prev-class-' + attrValue] = null;
           }
         } else {
           if (parsed[0] !== false && parsed[0] !== undefined && parsed[0] !== null) {

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

@@ -43,11 +43,6 @@ const assignmentOperations = {
   '^=': (c, a, b) => { c[a] ^= b; },
 };
 
-const logicalOperators = {
-  '||': (a, b) => a || b,
-  '&&': (a, b) => a && b,
-  '??': (a, b) => a ?? b,
-};
 
 const unaryOperators = {
   '-': a => -a,
@@ -96,20 +91,44 @@ 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) => {
+    const left = evalNode(node.left, context);
+    if (node.operator === '&&') return left ? evalNode(node.right, context) : left;
+    if (node.operator === '||') return left ? left : evalNode(node.right, context);
+    if (node.operator === '??') return left ?? 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);
-    const consequent = evalNode(node.consequent, context);
-    const alternate = evalNode(node.alternate, context);
-    return test ? consequent : alternate;
+    return test ? evalNode(node.consequent, context) : evalNode(node.alternate, context);
   },
   'MemberExpression': (node, context) => {
     const object = evalNode(node.object, context);
@@ -143,7 +162,7 @@ const nodeHandlers = {
     return arr;
   },
   'ObjectExpression': (node, context) => node.properties.reduce((acc, prop) => ({ ...acc, ...evalNode(prop, context) }), {}),
-  'ObjectProperty': (node, context) => ({ [evalNode(node.key, context)]: evalNode(node.value, context) }),
+  'ObjectProperty': (node, context) => ({ [node.computed ? evalNode(node.key, context) : (node.key.name ?? node.key.value)]: evalNode(node.value, context) }),
   'SpreadElement': (node, context) => evalNode(node.argument, context),
 
   'Identifier': (node, context) => {
@@ -160,7 +179,18 @@ const nodeHandlers = {
 
   'CallExpression': (node, context) => callFunction(node, context),
   'OptionalCallExpression': (node, context) => callFunction(node, context),
-  'NewExpression': (node, context) => callFunction(node, context),
+  'NewExpression': (node, context) => {
+    const callee = evalNode(node.callee, context);
+    const args = [];
+    node.arguments.map(argument => {
+      if (argument.type === 'SpreadElement') {
+        args.push(...evalNode(argument, context));
+      } else {
+        args.push(evalNode(argument, context));
+      }
+    });
+    return new callee(...args);
+  },
 
   'Directive': (node, context) => evalNode(node.value, context),
   'DirectiveLiteral': (node, context) => node.value,