ripple 0.3.68 → 0.3.70

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

@@ -4,324 +4,314 @@ import * as _$_ from 'ripple/internal/server';
 import { track } from 'ripple/server';
 
 export function StaticTitle() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
+
+			{
+				_$_.output_push('Content');
+			}
+
+			_$_.output_push('</div>');
+		});
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+		_$_.set_output_target('head');
+		_$_.output_push('<!--10f9ad59-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push('Content');
+			_$_.output_push('Static Test Title');
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--c8908187-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push('Static Test Title');
-	}
-
-	_$_.output_push('</title>');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }
 
 export function ReactiveTitle() {
-	_$_.push_component();
-
-	let lazy = _$_.track('Initial Title', 'cbca63e3');
-
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
-		_$_.output_push('>');
+	return _$_.tsrx_element(() => {
+		let lazy = _$_.track('Initial Title', 'cbca63e3');
 
-		{
-			_$_.output_push('<span');
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
 			_$_.output_push('>');
 
 			{
-				_$_.output_push(_$_.escape(lazy.value));
-			}
+				_$_.output_push('<span');
+				_$_.output_push('>');
 
-			_$_.output_push('</span>');
-		}
+				{
+					_$_.output_push(_$_.escape(lazy.value));
+				}
 
-		_$_.output_push('</div>');
-	});
+				_$_.output_push('</span>');
+			}
 
-	_$_.set_output_target('head');
-	_$_.output_push('<!--8af28792-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
+			_$_.output_push('</div>');
+		});
 
-	{
-		_$_.output_push(_$_.escape(lazy.value));
-	}
+		_$_.set_output_target('head');
+		_$_.output_push('<!--13811860-->');
+		_$_.output_push('<title');
+		_$_.output_push('>');
 
-	_$_.output_push('</title>');
-	_$_.set_output_target(null);
-	_$_.pop_component();
+		{
+			_$_.output_push(_$_.escape(lazy.value));
+		}
+
+		_$_.output_push('</title>');
+		_$_.set_output_target(null);
+	});
 }
 
 export function MultipleHeadElements() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
+
+			{
+				_$_.output_push('Page content');
+			}
+
+			_$_.output_push('</div>');
+		});
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+		_$_.set_output_target('head');
+		_$_.output_push('<!--478d48ee-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push('Page content');
+			_$_.output_push('Page Title');
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.output_push('<meta');
+		_$_.output_push(' name="description"');
+		_$_.output_push(' content="Page description"');
+		_$_.output_push(' />');
+		_$_.output_push('<link');
+		_$_.output_push(' rel="stylesheet"');
+		_$_.output_push(' href="/styles.css"');
+		_$_.output_push(' />');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--3a79945b-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push('Page Title');
-	}
-
-	_$_.output_push('</title>');
-	_$_.output_push('<meta');
-	_$_.output_push(' name="description"');
-	_$_.output_push(' content="Page description"');
-	_$_.output_push(' />');
-	_$_.output_push('<link');
-	_$_.output_push(' rel="stylesheet"');
-	_$_.output_push(' href="/styles.css"');
-	_$_.output_push(' />');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }
 
 export function ReactiveMetaTags() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		let lazy_1 = _$_.track('Initial description', '38bfa3b2');
+
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
+
+			{
+				_$_.output_push(_$_.escape(lazy_1.value));
+			}
 
-	let lazy_1 = _$_.track('Initial description', '38bfa3b2');
+			_$_.output_push('</div>');
+		});
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+		_$_.set_output_target('head');
+		_$_.output_push('<!--36dd8c9f-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push(_$_.escape(lazy_1.value));
+			_$_.output_push('My Page');
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.output_push('<meta');
+		_$_.output_push(' name="description"');
+		_$_.output_push(_$_.attr('content', lazy_1.value, false));
+		_$_.output_push(' />');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--c9fd7b0f-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push('My Page');
-	}
-
-	_$_.output_push('</title>');
-	_$_.output_push('<meta');
-	_$_.output_push(' name="description"');
-	_$_.output_push(_$_.attr('content', lazy_1.value, false));
-	_$_.output_push(' />');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }
 
 export function TitleWithTemplate() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		let lazy_2 = _$_.track('World', 'f3925cd5');
+
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
+
+			{
+				_$_.output_push(_$_.escape(lazy_2.value));
+			}
 
-	let lazy_2 = _$_.track('World', 'f3925cd5');
+			_$_.output_push('</div>');
+		});
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+		_$_.set_output_target('head');
+		_$_.output_push('<!--bf58d07e-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push(_$_.escape(lazy_2.value));
+			_$_.output_push(_$_.escape(`Hello ${lazy_2.value}!`));
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--72f81455-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push(_$_.escape(`Hello ${lazy_2.value}!`));
-	}
-
-	_$_.output_push('</title>');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }
 
 export function EmptyTitle() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+			{
+				_$_.output_push('Empty title test');
+			}
+
+			_$_.output_push('</div>');
+		});
+
+		_$_.set_output_target('head');
+		_$_.output_push('<!--146bbd6b-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push('Empty title test');
+			_$_.output_push('');
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--35a7fe4a-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push('');
-	}
-
-	_$_.output_push('</title>');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }
 
 export function ConditionalTitle() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		let lazy_3 = _$_.track(true, 'ff71bf1f');
+		let lazy_4 = _$_.track('Main Page', '7cd7d671');
+
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
 
-	let lazy_3 = _$_.track(true, 'ff71bf1f');
-	let lazy_4 = _$_.track('Main Page', '7cd7d671');
+			{
+				_$_.output_push(_$_.escape(lazy_4.value));
+			}
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+			_$_.output_push('</div>');
+		});
+
+		_$_.set_output_target('head');
+		_$_.output_push('<!--79341264-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push(_$_.escape(lazy_4.value));
+			_$_.output_push(_$_.escape(lazy_3.value ? 'App - ' + lazy_4.value : lazy_4.value));
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--453e9ed4-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push(_$_.escape(lazy_3.value ? 'App - ' + lazy_4.value : lazy_4.value));
-	}
-
-	_$_.output_push('</title>');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }
 
 export function ComputedTitle() {
-	_$_.push_component();
-
-	let lazy_5 = _$_.track(0, 'b6a48610');
-	let prefix = 'Count: ';
+	return _$_.tsrx_element(() => {
+		let lazy_5 = _$_.track(0, 'b6a48610');
+		let prefix = 'Count: ';
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
-		_$_.output_push('>');
-
-		{
-			_$_.output_push('<span');
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
 			_$_.output_push('>');
 
 			{
-				_$_.output_push(_$_.escape(lazy_5.value));
-			}
+				_$_.output_push('<span');
+				_$_.output_push('>');
 
-			_$_.output_push('</span>');
-		}
+				{
+					_$_.output_push(_$_.escape(lazy_5.value));
+				}
 
-		_$_.output_push('</div>');
-	});
+				_$_.output_push('</span>');
+			}
+
+			_$_.output_push('</div>');
+		});
 
-	_$_.set_output_target('head');
-	_$_.output_push('<!--63888c83-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
+		_$_.set_output_target('head');
+		_$_.output_push('<!--624d9ef2-->');
+		_$_.output_push('<title');
+		_$_.output_push('>');
 
-	{
-		_$_.output_push(_$_.escape(prefix + lazy_5.value));
-	}
+		{
+			_$_.output_push(_$_.escape(prefix + lazy_5.value));
+		}
 
-	_$_.output_push('</title>');
-	_$_.set_output_target(null);
-	_$_.pop_component();
+		_$_.output_push('</title>');
+		_$_.set_output_target(null);
+	});
 }
 
 export function MultipleHeadBlocks() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
+
+			{
+				_$_.output_push('Content');
+			}
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+			_$_.output_push('</div>');
+		});
+
+		_$_.set_output_target('head');
+		_$_.output_push('<!--111100ce-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push('Content');
+			_$_.output_push('First Head');
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.output_push('<!--423883ee-->');
+		_$_.output_push('<meta');
+		_$_.output_push(' name="author"');
+		_$_.output_push(' content="Test Author"');
+		_$_.output_push(' />');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--43cf39fd-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push('First Head');
-	}
-
-	_$_.output_push('</title>');
-	_$_.output_push('<!--e9abd92f-->');
-	_$_.output_push('<meta');
-	_$_.output_push(' name="author"');
-	_$_.output_push(' content="Test Author"');
-	_$_.output_push(' />');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }
 
 export function HeadWithStyle() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push('>');
+
+			{
+				_$_.output_push('Styled content');
+			}
+
+			_$_.output_push('</div>');
+		});
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
+		_$_.set_output_target('head');
+		_$_.output_push('<!--f3524d73-->');
+		_$_.output_push('<title');
 		_$_.output_push('>');
 
 		{
-			_$_.output_push('Styled content');
+			_$_.output_push('Styled Page');
 		}
 
-		_$_.output_push('</div>');
+		_$_.output_push('</title>');
+		_$_.set_output_target(null);
 	});
-
-	_$_.set_output_target('head');
-	_$_.output_push('<!--d246667e-->');
-	_$_.output_push('<title');
-	_$_.output_push('>');
-
-	{
-		_$_.output_push('Styled Page');
-	}
-
-	_$_.output_push('</title>');
-	_$_.set_output_target(null);
-	_$_.pop_component();
 }

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

@@ -4,101 +4,93 @@ import * as _$_ from 'ripple/internal/server';
 import { track } from 'ripple/server';
 
 export function Layout({ children }) {
-	_$_.push_component();
-
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
-		_$_.output_push(' class="layout"');
-		_$_.output_push('>');
-
-		{
-			_$_.output_push('<nav');
-			_$_.output_push(' class="nav"');
+	return _$_.tsrx_element(() => {
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push(' class="layout"');
 			_$_.output_push('>');
 
 			{
-				_$_.output_push('Navigation');
-			}
+				_$_.output_push('<nav');
+				_$_.output_push(' class="nav"');
+				_$_.output_push('>');
 
-			_$_.output_push('</nav>');
-			_$_.output_push('<main');
-			_$_.output_push(' class="main"');
-			_$_.output_push('>');
+				{
+					_$_.output_push('Navigation');
+				}
 
-			{
-				_$_.render_expression(children);
-			}
+				_$_.output_push('</nav>');
+				_$_.output_push('<main');
+				_$_.output_push(' class="main"');
+				_$_.output_push('>');
+
+				{
+					_$_.render_expression(children);
+				}
 
-			_$_.output_push('</main>');
-		}
+				_$_.output_push('</main>');
+			}
 
-		_$_.output_push('</div>');
+			_$_.output_push('</div>');
+		});
 	});
-
-	_$_.pop_component();
 }
 
 export function Content() {
-	_$_.push_component();
+	return _$_.tsrx_element(() => {
+		let lazy = _$_.track(true, '0bdb1500');
 
-	let lazy = _$_.track(true, '0bdb1500');
+		_$_.regular_block(() => {
+			_$_.output_push('<div');
+			_$_.output_push(' class="content"');
+			_$_.output_push('>');
 
-	_$_.regular_block(() => {
-		_$_.output_push('<div');
-		_$_.output_push(' class="content"');
-		_$_.output_push('>');
+			{
+				_$_.output_push('<!--[-->');
 
-		{
-			_$_.output_push('<!--[-->');
+				if (lazy.value) {
+					_$_.output_push('<p');
+					_$_.output_push(' class="text"');
+					_$_.output_push('>');
 
-			if (lazy.value) {
-				_$_.output_push('<p');
-				_$_.output_push(' class="text"');
-				_$_.output_push('>');
+					{
+						_$_.output_push('Hello world');
+					}
 
-				{
-					_$_.output_push('Hello world');
+					_$_.output_push('</p>');
 				}
 
-				_$_.output_push('</p>');
+				_$_.output_push('<!--]-->');
 			}
 
-			_$_.output_push('<!--]-->');
-		}
-
-		_$_.output_push('</div>');
+			_$_.output_push('</div>');
+		});
 	});
-
-	_$_.pop_component();
 }
 
 export function LayoutWithContent() {
-	_$_.push_component();
-
-	_$_.regular_block(() => {
-		{
-			const comp = Layout;
-
-			const args = [
-				{
-					children: _$_.tsrx_element(function render_children() {
-						_$_.push_component();
-
-						{
-							const comp = Content;
-							const args = [{}];
-
-							comp(...args);
-						}
-
-						_$_.pop_component();
-					})
-				}
-			];
-
-			comp(...args);
-		}
+	return _$_.tsrx_element(() => {
+		_$_.regular_block(() => {
+			{
+				const comp = Layout;
+
+				const args = [
+					{
+						children: _$_.tsrx_element(() => {
+							return _$_.tsrx_element(() => {
+								{
+									const comp = Content;
+									const args = [{}];
+
+									_$_.render_component(comp, ...args);
+								}
+							});
+						})
+					}
+				];
+
+				_$_.render_component(comp, ...args);
+			}
+		});
 	});
-
-	_$_.pop_component();
 }