ripple 0.3.103 → 0.3.105

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # ripple
 
+## 0.3.105
+
+## 0.3.104
+
 ## 0.3.103
 
 ### Patch Changes

package/package.json

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

package/tests/client/array/array.static.test.tsrx

@@ -138,9 +138,7 @@ describe('RippleArray > static', () => {
 						<div>{'Loading...'}</div>
 					} @catch (e) {
 						<>
-							<pre>
-								{'Error: ' + (e as Error).message}
-							</pre>
+							<pre>{'Error: ' + (e as Error).message}</pre>
 							<pre>{'No items'}</pre>
 						</>
 					}

package/tests/client/async-suspend.test.tsrx

@@ -361,9 +361,7 @@ describe('async suspense', () => {
 				});
 				// this is to make the times_rendered render together with double
 				<>
-					<div class="double">
-						{double + (++times_rendered - times_rendered)}
-					</div>
+					<div class="double">{double + (++times_rendered - times_rendered)}</div>
 					<div class="quadruple">{quadruple}</div>
 				</>
 			}
@@ -456,9 +454,7 @@ describe('async suspense', () => {
 				});
 				// this is to make the times_rendered render together with double
 				<>
-					<div class="double">
-						{double + (++times_rendered - times_rendered)}
-					</div>
+					<div class="double">{double + (++times_rendered - times_rendered)}</div>
 					<div class="quadruple">{quadruple}</div>
 				</>
 			}
@@ -541,9 +537,7 @@ describe('async suspense', () => {
 			});
 			// this is to make the times_rendered render together with double
 			<>
-				<div class="double">
-					{double + (++times_rendered - times_rendered)}
-				</div>
+				<div class="double">{double + (++times_rendered - times_rendered)}</div>
 				<div class="quadruple">{quadruple}</div>
 			</>
 		}

package/tests/client/basic/basic.collections.test.tsrx

@@ -86,9 +86,7 @@ describe('basic client > collections', () => {
 			<>
 				<pre>{String(array[3])}</pre>
 				<pre>{array[0]}</pre>
-				<pre>
-					{TRACKED_ARRAY in array}
-				</pre>
+				<pre>{TRACKED_ARRAY in array}</pre>
 				<button
 					onClick={() => {
 						array.push(array.length + 1);

package/tests/client/basic/basic.errors.test.tsrx

@@ -17,9 +17,7 @@ describe('basic client > errors', () => {
 			<div>
 				<button onClick={triggerError}>{'Trigger Error'}</button>
 				@if (hasError) {
-					<div class="error">
-						{'Error caught: ' + errorMessage}
-					</div>
+					<div class="error">{'Error caught: ' + errorMessage}</div>
 				} @else {
 					<div class="success">{'No error'}</div>
 				}

package/tests/client/basic/basic.reactivity.test.tsrx

@@ -92,9 +92,7 @@ describe('basic client > reactivity', () => {
 			let &[count] = track(5);
 			<>
 				<div class="count">{count}</div>
-				<div class="doubled">
-					{count * 2}
-				</div>
+				<div class="doubled">{count * 2}</div>
 				<div class="is-even">
 					{count % 2 === 0 ? 'Even' : 'Odd'}
 				</div>
@@ -162,18 +160,10 @@ describe('basic client > reactivity', () => {
 				>
 					{'second: ' + second.value}
 				</button>
-				<div>
-					{'Sum: ' + total.value}
-				</div>
-				<div>
-					{'Comma Separated: ' + arr.map((a) => a.value).join(', ')}
-				</div>
-				<div>
-					{'Number to string: ' + arr.map((a) => String(a.value))}
-				</div>
-				<div>
-					{'Even numbers: ' + arr.map((a) => a.value).filter((a) => a % 2 === 0)}
-				</div>
+				<div>{'Sum: ' + total.value}</div>
+				<div>{'Comma Separated: ' + arr.map((a) => a.value).join(', ')}</div>
+				<div>{'Number to string: ' + arr.map((a) => String(a.value))}</div>
+				<div>{'Even numbers: ' + arr.map((a) => a.value).filter((a) => a % 2 === 0)}</div>
 			</>
 		}
 
@@ -381,9 +371,7 @@ describe('basic client > reactivity', () => {
 		function App() @{
 			const t = track({ a: 1, b: 2, c: 3 });
 			const doublet = track(t);
-			<pre>
-				{t === doublet}
-			</pre>
+			<pre>{t === doublet}</pre>
 		}
 
 		render(App);

package/tests/client/basic/basic.rendering.test.tsrx

@@ -411,12 +411,8 @@ second
 			const staticMessage = 'Welcome to Ripple!';
 			<div class="mixed-content">
 				<h1>{staticMessage}</h1>
-				<p class="greeting">
-					{'Hello, ' + name + '!'}
-				</p>
-				<p class="notifications">
-					{'You have ' + count + ' notifications'}
-				</p>
+				<p class="greeting">{'Hello, ' + name + '!'}</p>
+				<p class="notifications">{'You have ' + count + ' notifications'}</p>
 				<button
 					onClick={() => {
 						count++;

package/tests/client/boundaries.test.tsrx

@@ -18,9 +18,7 @@ describe('passing reactivity between boundaries tests', () => {
 			let &[count, countTracked] = track(0);
 			const &[double] = createDouble(countTracked);
 			<>
-				<div>
-					{'Double: ' + double}
-				</div>
+				<div>{'Double: ' + double}</div>
 				<button
 					onClick={() => {
 						count++;
@@ -67,9 +65,7 @@ describe('passing reactivity between boundaries tests', () => {
 			let count = track(0);
 			const { double } = createDouble({ count });
 			<>
-				<div>
-					{'Double: ' + double.value}
-				</div>
+				<div>{'Double: ' + double.value}</div>
 				<button
 					onClick={() => {
 						count.value++;

package/tests/client/code-block-children.test.tsrx

@@ -28,9 +28,7 @@ describe('code blocks in template children position', () => {
 					@{
 						const y = 2;
 						@{
-							<span class="sum">
-								{x + y}
-							</span>
+							<span class="sum">{x + y}</span>
 						}
 					}
 				}
@@ -118,9 +116,7 @@ describe('code blocks in template children position', () => {
 					@{
 						const x = 2;
 						@{
-							<span class="sum">
-								{x + y}
-							</span>
+							<span class="sum">{x + y}</span>
 						}
 					}
 				}
@@ -163,9 +159,7 @@ describe('code blocks in template children position', () => {
 					@{
 						const y = 2;
 						@{
-							<span class="sum">
-								{x + y}
-							</span>
+							<span class="sum">{x + y}</span>
 						}
 					}
 				}

package/tests/client/composite/composite.reactivity.test.tsrx

@@ -198,9 +198,7 @@ describe('composite > reactivity', () => {
 			effect(() => {
 				logs.push(`Child effect: ${a}, ${b}, ${c}`);
 			});
-			<div>
-				{a + ' ' + b + ' ' + c}
-			</div>
+			<div>{a + ' ' + b + ' ' + c}</div>
 		}
 
 		render(App);

package/tests/client/for.test.tsrx

@@ -136,9 +136,7 @@ describe('for statements', () => {
 			<>
 				<div>
 					@for (let item of items; index i) {
-						<div>
-							{i + ' : ' + item}
-						</div>
+						<div>{i + ' : ' + item}</div>
 					}
 				</div>
 				<button
@@ -174,9 +172,7 @@ describe('for statements', () => {
 			]);
 			<>
 				@for (let item of items; index i; key item.id) {
-					<div>
-						{i + ':' + item.text}
-					</div>
+					<div>{i + ':' + item.text}</div>
 				}
 				<button
 					onClick={() => {
@@ -243,9 +239,7 @@ describe('for statements', () => {
 			<>
 				<div>
 					@for (let item of items; index idx; key item.id) {
-						<span class="item">
-							{idx + ':' + item.text}
-						</span>
+						<span class="item">{idx + ':' + item.text}</span>
 					}
 				</div>
 				<button
@@ -279,9 +273,7 @@ describe('for statements', () => {
 			]);
 			<>
 				@for (let item of items; index i; key item.id) {
-					<div>
-						{i + ':' + item.text}
-					</div>
+					<div>{i + ':' + item.text}</div>
 				}
 				<button
 					onClick={() => {

package/tests/client/head.test.tsrx

@@ -94,9 +94,7 @@ describe('head elements', () => {
 			let prefix = 'Count: ';
 			<>
 				<head>
-					<title>
-						{prefix + count}
-					</title>
+					<title>{prefix + count}</title>
 				</head>
 				<div>
 					<button

package/tests/client/object.test.tsrx

@@ -59,9 +59,7 @@ describe('RippleObject', () => {
 		function ObjectTest() @{
 			const obj = new RippleObject({ a: -1, b: 1 });
 			obj.a = 0;
-			<pre>
-				{'a' in obj && 'b' in obj}
-			</pre>
+			<pre>{'a' in obj && 'b' in obj}</pre>
 		}
 
 		render(ObjectTest);
@@ -165,9 +163,7 @@ describe('RippleObject', () => {
 			const obj = new RippleObject({ a: 0, b: 1, c: { d: { e: 8 } } });
 			<>
 				<pre>{obj.a}</pre>
-				<pre>
-					{TRACKED_OBJECT in obj}
-				</pre>
+				<pre>{TRACKED_OBJECT in obj}</pre>
 				<pre>{JSON.stringify(obj)}</pre>
 				<button
 					onClick={() => {

package/tests/client/switch.test.tsrx

@@ -77,9 +77,7 @@ describe('switch statements', () => {
 				<button onClick={() => (value = 'y')}>{'Change Value'}</button>
 				@switch (value) {
 					@default: {
-						<div>
-							{'Default for ' + value}
-						</div>
+						<div>{'Default for ' + value}</div>
 					}
 				}
 			</>
@@ -149,27 +147,19 @@ describe('switch statements', () => {
 				@switch (status) {
 					@case 'active': {
 						message = 'Currently active.';
-						<div>
-							{'Status: ' + message}
-						</div>
+						<div>{'Status: ' + message}</div>
 					}
 					@case 'pending': {
 						message = 'Waiting for completion.';
-						<div>
-							{'Status: ' + message}
-						</div>
+						<div>{'Status: ' + message}</div>
 					}
 					@case 'completed': {
 						message = 'Task finished!';
-						<div class="success">
-							{'Status: ' + message}
-						</div>
+						<div class="success">{'Status: ' + message}</div>
 					}
 					@default: {
 						message = 'An error occurred.';
-						<div class="error">
-							{'Status: ' + message}
-						</div>
+						<div class="error">{'Status: ' + message}</div>
 					}
 				}
 			</>
@@ -285,9 +275,7 @@ describe('switch statements', () => {
 							<div>{' Case A'}</div>
 						}
 						@case 'x': {
-							<div>
-								{' Default Case for ' + value}
-							</div>
+							<div>{' Default Case for ' + value}</div>
 						}
 						@case 'b': {
 							<div>{' Case B'}</div>

package/tests/client/tsx.test.tsrx

@@ -164,9 +164,7 @@ describe('tsx expression', () => {
 		function App() @{
 			let &[count] = track(0);
 			const el = <>
-				<div>
-					{'count: ' + count}
-				</div>
+				<div>{'count: ' + count}</div>
 			</>;
 			<>
 				{el}
@@ -740,9 +738,7 @@ describe('tsrx expression', () => {
 		function App() @{
 			let &[count] = track(0);
 			const el = <>
-				<div>
-					{'count: ' + count}
-				</div>
+				<div>{'count: ' + count}</div>
 			</>;
 			<>
 				{el}

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

@@ -253,11 +253,11 @@ export function MultipleHeadBlocks() {
 		_$_.expression(node_8, () => _$_.tsrx_element((__anchor, __block) => {
 			var div_8 = root_19();
 
-			_$_.head('9a44f25d', (__anchor) => {
+			_$_.head('e50b427b', (__anchor) => {
 				_$_.document.title = 'First Head';
 			});
 
-			_$_.head('0873e476', (__anchor) => {
+			_$_.head('68467dce', (__anchor) => {
 				var meta_1 = root_20();
 
 				_$_.append(__anchor, meta_1);
@@ -278,7 +278,7 @@ export function HeadWithStyle() {
 		_$_.expression(node_9, () => _$_.tsrx_element((__anchor, __block) => {
 			var div_9 = root_22();
 
-			_$_.head('d75c5358', (__anchor) => {
+			_$_.head('3a8578a5', (__anchor) => {
 				_$_.document.title = 'Styled Page';
 			});
 

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

@@ -308,7 +308,7 @@ function HeadContent() {
 							_$_.pop(p_7);
 						}
 
-						_$_.head('e957a664', (__anchor) => {
+						_$_.head('814bacd9', (__anchor) => {
 							_$_.render(() => {
 								_$_.document.title = 'title:' + lazy_5.value;
 							});

package/tests/hydration/compiled/server/head.js

@@ -168,7 +168,7 @@ export function MultipleHeadBlocks() {
 			_$_.output_push(__out);
 			__out = '';
 			_$_.set_output_target('head');
-			__out += '<!--9a44f25d--><title>First Head</title><!--0873e476--><meta name="author" content="Test Author" />';
+			__out += '<!--e50b427b--><title>First Head</title><!--68467dce--><meta name="author" content="Test Author" />';
 			_$_.output_push(__out);
 			__out = '';
 			_$_.set_output_target(null);
@@ -186,7 +186,7 @@ export function HeadWithStyle() {
 			_$_.output_push(__out);
 			__out = '';
 			_$_.set_output_target('head');
-			__out += '<!--d75c5358--><title>Styled Page</title>';
+			__out += '<!--3a8578a5--><title>Styled Page</title>';
 			_$_.output_push(__out);
 			__out = '';
 			_$_.set_output_target(null);

package/tests/hydration/compiled/server/streaming.js

@@ -306,7 +306,7 @@ function HeadContent() {
 				_$_.output_push(__out);
 				__out = '';
 				_$_.set_output_target('head');
-				__out += '<!--e957a664--><title>' + _$_.escape('title:' + lazy_5.value) + '</title>';
+				__out += '<!--814bacd9--><title>' + _$_.escape('title:' + lazy_5.value) + '</title>';
 				_$_.output_push(__out);
 				__out = '';
 				_$_.set_output_target(null);

package/tests/hydration/components/head.tsrx

@@ -88,9 +88,7 @@ export function ComputedTitle() @{
 	let prefix = 'Count: ';
 	<>
 		<head>
-			<title>
-				{prefix + count}
-			</title>
+			<title>{prefix + count}</title>
 		</head>
 		<div>
 			<span>{count}</span>

package/tests/hydration/components/streaming.tsrx

@@ -35,9 +35,7 @@ function BasicContent() @{
 	let &[data] = trackAsync(() => controls.basic.promise);
 	let &[count] = track(0);
 	<div class="resolved">
-		<span class="value">
-			{data + ':' + count}
-		</span>
+		<span class="value">{data + ':' + count}</span>
 		<button class="inc" onClick={() => count++}>{'inc'}</button>
 	</div>
 }
@@ -115,9 +113,7 @@ function HeadContent() @{
 		@if (data) {
 			<>
 				<head>
-					<title>
-						{'title:' + data}
-					</title>
+					<title>{'title:' + data}</title>
 				</head>
 				<p class="head-content">{data}</p>
 			</>

package/tests/server/code-block-children.test.tsrx

@@ -24,9 +24,7 @@ describe('code blocks in template children position', () => {
 					@{
 						const y = 2;
 						@{
-							<span class="sum">
-								{x + y}
-							</span>
+							<span class="sum">{x + y}</span>
 						}
 					}
 				}
@@ -87,9 +85,7 @@ describe('code blocks in template children position', () => {
 					@{
 						const x = 2;
 						@{
-							<span class="sum">
-								{x + y}
-							</span>
+							<span class="sum">{x + y}</span>
 						}
 					}
 				}
@@ -110,9 +106,7 @@ describe('code blocks in template children position', () => {
 					@{
 						const y = 2;
 						@{
-							<span class="sum">
-								{x + y}
-							</span>
+							<span class="sum">{x + y}</span>
 						}
 					}
 				}

package/tests/server/head.test.tsrx

@@ -58,9 +58,7 @@ describe('head elements', () => {
 			let prefix = 'Count: ';
 			<>
 				<head>
-					<title>
-						{prefix + count}
-					</title>
+					<title>{prefix + count}</title>
 				</head>
 				<div>
 					<span>{count}</span>

package/tests/server/streaming-ssr.test.tsrx

@@ -299,9 +299,7 @@ describe('streaming try/pending boundaries', () => {
 		}
 
 		function RootCatch({ error }: { error: unknown }) @{
-			<h2>
-				{'root caught: ' + (error instanceof Error ? error.message : String(error))}
-			</h2>
+			<h2>{'root caught: ' + (error instanceof Error ? error.message : String(error))}</h2>
 		}
 
 		const { chunks, sink } = recordingSink();
@@ -423,16 +421,12 @@ describe('streaming nested and sibling boundaries', () => {
 
 		function First() @{
 			let &[data] = trackAsync(() => d_first.promise);
-			<p>
-				{'first: ' + data}
-			</p>
+			<p>{'first: ' + data}</p>
 		}
 
 		function Second() @{
 			let &[data] = trackAsync(() => d_second.promise);
-			<p>
-				{'second: ' + data}
-			</p>
+			<p>{'second: ' + data}</p>
 		}
 
 		function App() @{
@@ -475,21 +469,15 @@ describe('streaming nested and sibling boundaries', () => {
 			function makeApp(ds: Deferred<string>[]) {
 				function A() @{
 					let &[data] = trackAsync(() => ds[0].promise);
-					<p>
-						{'A:' + data}
-					</p>
+					<p>{'A:' + data}</p>
 				}
 				function B() @{
 					let &[data] = trackAsync(() => ds[1].promise);
-					<p>
-						{'B:' + data}
-					</p>
+					<p>{'B:' + data}</p>
 				}
 				function C() @{
 					let &[data] = trackAsync(() => ds[2].promise);
-					<p>
-						{'C:' + data}
-					</p>
+					<p>{'C:' + data}</p>
 				}
 
 				function App() @{
@@ -553,9 +541,7 @@ describe('streaming root boundary', () => {
 
 		function App() @{
 			let &[data] = trackAsync(() => d.promise);
-			<p>
-				{'app: ' + data}
-			</p>
+			<p>{'app: ' + data}</p>
 		}
 
 		function RootPending() @{
@@ -631,9 +617,7 @@ describe('streaming head content', () => {
 				@if (data) {
 					<>
 						<head>
-							<title>
-								{'title:' + data}
-							</title>
+							<title>{'title:' + data}</title>
 						</head>
 						<p class="has-head">{data}</p>
 					</>