ripple 0.2.57 → 0.2.58

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ripple is an elegant TypeScript UI framework",
   "license": "MIT",
   "author": "Dominic Gannaway",
-  "version": "0.2.57",
+  "version": "0.2.58",
   "type": "module",
   "module": "src/runtime/index.js",
   "main": "src/runtime/index.js",

package/src/compiler/phases/1-parse/index.js

@@ -293,7 +293,7 @@ function RipplePlugin(config) {
         node.block = this.parseBlock();
         node.handler = null;
 
-		if (this.value === 'pending') {
+        if (this.value === 'pending') {
           this.next();
           node.pending = this.parseBlock();
         } else {
@@ -487,8 +487,10 @@ function RipplePlugin(config) {
             if (attr.name.type === 'JSXIdentifier') {
               attr.name.type = 'Identifier';
             }
-            if (attr.value.type === 'JSXExpressionContainer') {
-              attr.value = attr.value.expression;
+            if (attr.value !== null) {
+              if (attr.value.type === 'JSXExpressionContainer') {
+                attr.value = attr.value.expression;
+              }
             }
           }
         }

package/src/compiler/phases/2-analyze/index.js

@@ -409,7 +409,7 @@ const visitors = {
 
                 attr.metadata.delegated = delegated_event;
               }
-            } else {
+            } else if (attr.value !== null) {
               visit(attr.value, state);
             }
           }

package/src/compiler/phases/3-transform/index.js

@@ -470,6 +470,11 @@ const visitors = {
           if (attr.name.type === 'Identifier') {
             const name = attr.name.name;
 
+            if (attr.value === null) {
+              handle_static_attr(name, true);
+              continue;
+            } 
+
             if (attr.value.type === 'Literal' && name !== 'class') {
               handle_static_attr(name, attr.value.value);
               continue;

package/tests/__snapshots__/basic.test.ripple.snap

@@ -1,5 +1,24 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
+exports[`basic > handles boolean attributes with no prop value provides 1`] = `
+<div>
+  <div
+    class="container"
+  >
+    <button
+      disabled=""
+    >
+      Button
+    </button>
+    <input
+      checked=""
+      type="checkbox"
+    />
+  </div>
+  
+</div>
+`;
+
 exports[`basic > render semi-dynamic text 1`] = `
 <div>
   <div>

package/tests/basic.test.ripple

@@ -1246,4 +1246,16 @@ describe('basic', () => {
 		flushSync();
 		expect(countSpan.textContent).toBe('1');
 	});
+
+	it('handles boolean attributes with no prop value provides', () => {
+		component App() {
+			<div class="container">
+				<button onClick={() => console.log("clicked!")} disabled>{"Button"}</button>
+				<input type="checkbox" checked />
+			</div>
+		}
+
+		render(App);
+		expect(container).toMatchSnapshot();
+	});
 });