ripple 0.2.26 → 0.2.27

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ripple is a TypeScript UI framework for the web",
   "license": "MIT",
   "author": "Dominic Gannaway",
-  "version": "0.2.26",
+  "version": "0.2.27",
   "type": "module",
   "module": "src/runtime/index.js",
   "main": "src/runtime/index.js",

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

@@ -744,7 +744,13 @@ const visitors = {
 						if (prop_statements === undefined) {
 							prop_statements = [];
 						}
-						prop_statements.push(b.var(name, b.member(b.id('__props'), key)));
+						if (path.has_default_value) {
+							const fallback = path.expression(b.id('__props'));
+
+							prop_statements.push(b.var(name, context.visit(fallback)));
+						} else {
+							prop_statements.push(b.var(name, b.member(b.id('__props'), key)));
+						}
 					} else if (binding !== null && path.has_default_value) {
 						if (prop_statements === undefined) {
 							prop_statements = [];

package/tests/composite.test.ripple

@@ -261,6 +261,24 @@ describe('composite components', () => {
 		expect(container.querySelectorAll('div')[1].textContent).toBe('123');
 	});
 
+		it('correctly handles default prop values #2', () => {
+		component Child({ foo = 456 }) {
+			<div>{foo}</div>
+		}
+
+		component App(props) {
+			let foo = 123;
+
+			<Child />
+			<Child {foo} />
+		}
+
+		render(App);
+
+		expect(container.querySelectorAll('div')[0].textContent).toBe('456');
+		expect(container.querySelectorAll('div')[1].textContent).toBe('123');
+	});
+
 	it('correctly handles no props', () => {
 		component Child(props) {
 			<div>{props.$foo}</div>