ripple 0.3.6 → 0.3.8

package/tests/client/url-search-params/url-search-params.iteration.test.ripple

@@ -4,10 +4,10 @@ describe('RippleURLSearchParams > iteration', () => {
 	it('handles keys method with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&baz=qux');
-			let keys = track(() => Array.from(params.keys()));
+			let &[keys] = track(() => Array.from(params.keys()));
 
 			<button onClick={() => params.append('new', 'value')}>{'add param'}</button>
-			<pre>{JSON.stringify(@keys)}</pre>
+			<pre>{JSON.stringify(keys)}</pre>
 		}
 
 		render(URLTest);
@@ -27,10 +27,10 @@ describe('RippleURLSearchParams > iteration', () => {
 	it('handles values method with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&baz=qux');
-			let values = track(() => Array.from(params.values()));
+			let &[values] = track(() => Array.from(params.values()));
 
 			<button onClick={() => params.set('foo', 'updated')}>{'update foo'}</button>
-			<pre>{JSON.stringify(@values)}</pre>
+			<pre>{JSON.stringify(values)}</pre>
 		}
 
 		render(URLTest);
@@ -50,10 +50,10 @@ describe('RippleURLSearchParams > iteration', () => {
 	it('handles entries method with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&baz=qux');
-			let entries = track(() => Array.from(params.entries()));
+			let &[entries] = track(() => Array.from(params.entries()));
 
 			<button onClick={() => params.append('new', 'value')}>{'add param'}</button>
-			<pre>{JSON.stringify(@entries)}</pre>
+			<pre>{JSON.stringify(entries)}</pre>
 		}
 
 		render(URLTest);
@@ -75,10 +75,10 @@ describe('RippleURLSearchParams > iteration', () => {
 	it('handles Symbol.iterator with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&baz=qux');
-			let entries = track(() => Array.from(params));
+			let &[entries] = track(() => Array.from(params));
 
 			<button onClick={() => params.delete('foo')}>{'delete foo'}</button>
-			<pre>{JSON.stringify(@entries)}</pre>
+			<pre>{JSON.stringify(entries)}</pre>
 		}
 
 		render(URLTest);
@@ -126,7 +126,7 @@ describe('RippleURLSearchParams > iteration', () => {
 	it('handles forEach iteration', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('a=1&b=2&c=3');
-			let sum = track(() => {
+			let &[sum] = track(() => {
 				let total = 0;
 				// Access the params reactively through entries
 				for (const [key, value] of params.entries()) {
@@ -136,7 +136,7 @@ describe('RippleURLSearchParams > iteration', () => {
 			});
 
 			<button onClick={() => params.append('d', '4')}>{'add d=4'}</button>
-			<pre>{@sum}</pre>
+			<pre>{sum}</pre>
 		}
 
 		render(URLTest);

package/tests/client/url-search-params/url-search-params.mutation.test.ripple

@@ -29,11 +29,11 @@ describe('RippleURLSearchParams > mutation', () => {
 	it('handles append with multiple values for same key', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar');
-			let allFoo = track(() => params.getAll('foo'));
+			let &[allFoo] = track(() => params.getAll('foo'));
 
 			<button onClick={() => params.append('foo', 'baz')}>{'append foo'}</button>
 			<pre>{params.toString()}</pre>
-			<pre>{JSON.stringify(@allFoo)}</pre>
+			<pre>{JSON.stringify(allFoo)}</pre>
 		}
 
 		render(URLTest);
@@ -108,11 +108,11 @@ describe('RippleURLSearchParams > mutation', () => {
 	it('handles delete when key does not exist', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar');
-			let reactiveSize = track(() => params.size);
+			let &[reactiveSize] = track(() => params.size);
 
 			<button onClick={() => params.delete('nonexistent')}>{'delete nonexistent'}</button>
 			<pre>{params.toString()}</pre>
-			<pre>{@reactiveSize}</pre>
+			<pre>{reactiveSize}</pre>
 		}
 
 		render(URLTest);
@@ -168,11 +168,11 @@ describe('RippleURLSearchParams > mutation', () => {
 	it('handles set with multiple existing values', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&foo=baz&foo=qux');
-			let allFoo = track(() => params.getAll('foo'));
+			let &[allFoo] = track(() => params.getAll('foo'));
 
 			<button onClick={() => params.set('foo', 'single')}>{'set foo'}</button>
 			<pre>{params.toString()}</pre>
-			<pre>{JSON.stringify(@allFoo)}</pre>
+			<pre>{JSON.stringify(allFoo)}</pre>
 		}
 
 		render(URLTest);
@@ -194,10 +194,10 @@ describe('RippleURLSearchParams > mutation', () => {
 	it('handles set when value is the same', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar');
-			let reactiveString = track(() => params.toString());
+			let &[reactiveString] = track(() => params.toString());
 
 			<button onClick={() => params.set('foo', 'bar')}>{'set same value'}</button>
-			<pre>{@reactiveString}</pre>
+			<pre>{reactiveString}</pre>
 			<pre>{params.size}</pre>
 		}
 
@@ -312,12 +312,12 @@ describe('RippleURLSearchParams > mutation', () => {
 	it('handles duplicate keys with different values', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams();
-			let tags = track(() => params.getAll('tag'));
+			let &[tags] = track(() => params.getAll('tag'));
 
 			<button onClick={() => params.append('tag', 'javascript')}>{'add js'}</button>
 			<button onClick={() => params.append('tag', 'typescript')}>{'add ts'}</button>
 			<button onClick={() => params.append('tag', 'ripple')}>{'add ripple'}</button>
-			<pre>{JSON.stringify(@tags)}</pre>
+			<pre>{JSON.stringify(tags)}</pre>
 			<pre>{params.size}</pre>
 		}
 

package/tests/client/url-search-params/url-search-params.retrieval.test.ripple

@@ -4,12 +4,12 @@ describe('RippleURLSearchParams > retrieval', () => {
 	it('handles get operation with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&baz=qux');
-			let foo = track(() => params.get('foo'));
-			let baz = track(() => params.get('baz'));
+			let &[foo] = track(() => params.get('foo'));
+			let &[baz] = track(() => params.get('baz'));
 
 			<button onClick={() => params.set('foo', 'updated')}>{'update foo'}</button>
-			<pre>{@foo}</pre>
-			<pre>{@baz}</pre>
+			<pre>{foo}</pre>
+			<pre>{baz}</pre>
 		}
 
 		render(URLTest);
@@ -31,9 +31,9 @@ describe('RippleURLSearchParams > retrieval', () => {
 	it('handles get for nonexistent key', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar');
-			let nonexistent = track(() => params.get('nonexistent'));
+			let &[nonexistent] = track(() => params.get('nonexistent'));
 
-			<pre>{String(@nonexistent)}</pre>
+			<pre>{String(nonexistent)}</pre>
 		}
 
 		render(URLTest);
@@ -44,10 +44,10 @@ describe('RippleURLSearchParams > retrieval', () => {
 	it('handles getAll operation with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&foo=baz');
-			let allFoo = track(() => params.getAll('foo'));
+			let &[allFoo] = track(() => params.getAll('foo'));
 
 			<button onClick={() => params.append('foo', 'qux')}>{'append foo'}</button>
-			<pre>{JSON.stringify(@allFoo)}</pre>
+			<pre>{JSON.stringify(allFoo)}</pre>
 		}
 
 		render(URLTest);
@@ -67,13 +67,13 @@ describe('RippleURLSearchParams > retrieval', () => {
 	it('handles has operation with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar');
-			let hasFoo = track(() => params.has('foo'));
-			let hasBaz = track(() => params.has('baz'));
+			let &[hasFoo] = track(() => params.has('foo'));
+			let &[hasBaz] = track(() => params.has('baz'));
 
 			<button onClick={() => params.append('baz', 'qux')}>{'add baz'}</button>
 			<button onClick={() => params.delete('foo')}>{'delete foo'}</button>
-			<pre>{@hasFoo.toString()}</pre>
-			<pre>{@hasBaz.toString()}</pre>
+			<pre>{hasFoo.toString()}</pre>
+			<pre>{hasBaz.toString()}</pre>
 		}
 
 		render(URLTest);
@@ -103,12 +103,12 @@ describe('RippleURLSearchParams > retrieval', () => {
 	it('handles has with specific value', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar&foo=baz');
-			let hasBarValue = track(() => params.has('foo', 'bar'));
-			let hasQuxValue = track(() => params.has('foo', 'qux'));
+			let &[hasBarValue] = track(() => params.has('foo', 'bar'));
+			let &[hasQuxValue] = track(() => params.has('foo', 'qux'));
 
 			<button onClick={() => params.append('foo', 'qux')}>{'add qux'}</button>
-			<pre>{@hasBarValue.toString()}</pre>
-			<pre>{@hasQuxValue.toString()}</pre>
+			<pre>{hasBarValue.toString()}</pre>
+			<pre>{hasQuxValue.toString()}</pre>
 		}
 
 		render(URLTest);
@@ -130,11 +130,11 @@ describe('RippleURLSearchParams > retrieval', () => {
 	it('handles size property with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar');
-			let size = track(() => params.size);
+			let &[size] = track(() => params.size);
 
 			<button onClick={() => params.append('baz', 'qux')}>{'add'}</button>
 			<button onClick={() => params.delete('foo')}>{'delete'}</button>
-			<pre>{@size}</pre>
+			<pre>{size}</pre>
 		}
 
 		render(URLTest);

package/tests/client/url-search-params/url-search-params.serialization.test.ripple

@@ -4,10 +4,10 @@ describe('RippleURLSearchParams > serialization', () => {
 	it('handles toString method with reactivity', () => {
 		component URLTest() {
 			const params = RippleURLSearchParams('foo=bar');
-			let string = track(() => params.toString());
+			let &[string] = track(() => params.toString());
 
 			<button onClick={() => params.append('baz', 'qux')}>{'add'}</button>
-			<pre>{@string}</pre>
+			<pre>{string}</pre>
 		}
 
 		render(URLTest);

package/tests/hydration/compiled/client/events.js

@@ -14,14 +14,14 @@ import { track } from 'ripple';
 export function ClickCounter(__anchor, _, __block) {
 	_$_.push_component();
 
-	let count = _$_.track(0, void 0, void 0, __block);
+	let lazy = _$_.track(0, void 0, void 0, __block);
 	var div_1 = root();
 
 	{
 		var button_1 = _$_.child(div_1);
 
 		button_1.__click = () => {
-			_$_.update(count);
+			_$_.update(lazy);
 		};
 
 		var span_1 = _$_.sibling(button_1);
@@ -34,7 +34,7 @@ export function ClickCounter(__anchor, _, __block) {
 	}
 
 	_$_.render(() => {
-		_$_.set_text(text, _$_.get(count));
+		_$_.set_text(text, _$_.get(lazy));
 	});
 
 	_$_.append(__anchor, div_1);
@@ -44,14 +44,14 @@ export function ClickCounter(__anchor, _, __block) {
 export function IncrementDecrement(__anchor, _, __block) {
 	_$_.push_component();
 
-	let count = _$_.track(0, void 0, void 0, __block);
+	let lazy_1 = _$_.track(0, void 0, void 0, __block);
 	var div_2 = root_1();
 
 	{
 		var button_2 = _$_.child(div_2);
 
 		button_2.__click = () => {
-			_$_.update(count, -1);
+			_$_.update(lazy_1, -1);
 		};
 
 		var span_2 = _$_.sibling(button_2);
@@ -65,12 +65,12 @@ export function IncrementDecrement(__anchor, _, __block) {
 		var button_3 = _$_.sibling(span_2);
 
 		button_3.__click = () => {
-			_$_.update(count);
+			_$_.update(lazy_1);
 		};
 	}
 
 	_$_.render(() => {
-		_$_.set_text(text_1, _$_.get(count));
+		_$_.set_text(text_1, _$_.get(lazy_1));
 	});
 
 	_$_.append(__anchor, div_2);
@@ -80,19 +80,19 @@ export function IncrementDecrement(__anchor, _, __block) {
 export function MultipleEvents(__anchor, _, __block) {
 	_$_.push_component();
 
-	let clicks = _$_.track(0, void 0, void 0, __block);
-	let hovers = _$_.track(0, void 0, void 0, __block);
+	let lazy_2 = _$_.track(0, void 0, void 0, __block);
+	let lazy_3 = _$_.track(0, void 0, void 0, __block);
 	var div_3 = root_2();
 
 	{
 		var button_4 = _$_.child(div_3);
 
 		button_4.__click = () => {
-			_$_.update(clicks);
+			_$_.update(lazy_2);
 		};
 
 		_$_.event('MouseEnter', button_4, () => {
-			_$_.update(hovers);
+			_$_.update(lazy_3);
 		});
 
 		var span_3 = _$_.sibling(button_4);
@@ -114,13 +114,13 @@ export function MultipleEvents(__anchor, _, __block) {
 
 	_$_.render(
 		(__prev) => {
-			var __a = _$_.get(clicks);
+			var __a = _$_.get(lazy_2);
 
 			if (__prev.a !== __a) {
 				_$_.set_text(text_2, __prev.a = __a);
 			}
 
-			var __b = _$_.get(hovers);
+			var __b = _$_.get(lazy_3);
 
 			if (__prev.b !== __b) {
 				_$_.set_text(text_3, __prev.b = __b);
@@ -136,12 +136,12 @@ export function MultipleEvents(__anchor, _, __block) {
 export function MultiStateUpdate(__anchor, _, __block) {
 	_$_.push_component();
 
-	let count = _$_.track(0, void 0, void 0, __block);
-	let lastAction = _$_.track('none', void 0, void 0, __block);
+	let lazy_4 = _$_.track(0, void 0, void 0, __block);
+	let lazy_5 = _$_.track('none', void 0, void 0, __block);
 
 	const handleClick = () => {
-		_$_.update(count);
-		_$_.set(lastAction, 'increment');
+		_$_.update(lazy_4);
+		_$_.set(lazy_5, 'increment');
 	};
 
 	var div_4 = root_3();
@@ -170,13 +170,13 @@ export function MultiStateUpdate(__anchor, _, __block) {
 
 	_$_.render(
 		(__prev) => {
-			var __a = _$_.get(count);
+			var __a = _$_.get(lazy_4);
 
 			if (__prev.a !== __a) {
 				_$_.set_text(text_4, __prev.a = __a);
 			}
 
-			var __b = _$_.get(lastAction);
+			var __b = _$_.get(lazy_5);
 
 			if (__prev.b !== __b) {
 				_$_.set_text(text_5, __prev.b = __b);
@@ -192,14 +192,14 @@ export function MultiStateUpdate(__anchor, _, __block) {
 export function ToggleButton(__anchor, _, __block) {
 	_$_.push_component();
 
-	let isOn = _$_.track(false, void 0, void 0, __block);
+	let lazy_6 = _$_.track(false, void 0, void 0, __block);
 	var div_5 = root_4();
 
 	{
 		var button_6 = _$_.child(div_5);
 
 		button_6.__click = () => {
-			_$_.set(isOn, !_$_.get(isOn));
+			_$_.set(lazy_6, !_$_.get(lazy_6));
 		};
 
 		{
@@ -210,7 +210,7 @@ export function ToggleButton(__anchor, _, __block) {
 	}
 
 	_$_.render(() => {
-		_$_.set_text(text_6, _$_.get(isOn) ? 'ON' : 'OFF');
+		_$_.set_text(text_6, _$_.get(lazy_6) ? 'ON' : 'OFF');
 	});
 
 	_$_.append(__anchor, div_5);
@@ -241,7 +241,7 @@ export function ChildButton(__anchor, props, __block) {
 export function ParentWithChildButton(__anchor, _, __block) {
 	_$_.push_component();
 
-	let count = _$_.track(0, void 0, void 0, __block);
+	let lazy_7 = _$_.track(0, void 0, void 0, __block);
 	var div_6 = root_6();
 
 	{
@@ -251,7 +251,7 @@ export function ParentWithChildButton(__anchor, _, __block) {
 			node,
 			{
 				onClick: () => {
-					_$_.update(count);
+					_$_.update(lazy_7);
 				},
 				label: "Click me"
 			},
@@ -270,7 +270,7 @@ export function ParentWithChildButton(__anchor, _, __block) {
 	}
 
 	_$_.render(() => {
-		_$_.set_text(text_8, _$_.get(count));
+		_$_.set_text(text_8, _$_.get(lazy_7));
 	});
 
 	_$_.append(__anchor, div_6);