ripple 0.3.68 → 0.3.69

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

@@ -17,204 +17,194 @@ var root_12 = _$_.template(`<div>Styled content</div>`, 0);
 
 import { track } from 'ripple';
 
-export function StaticTitle(__anchor, _, __block) {
-	_$_.push_component();
+export function StaticTitle() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		var div_1 = root();
 
-	var div_1 = root();
+		_$_.head('10f9ad59', (__anchor) => {
+			_$_.document.title = 'Static Test Title';
+		});
 
-	_$_.head('c8908187', (__anchor) => {
-		_$_.document.title = 'Static Test Title';
+		_$_.append(__anchor, div_1);
 	});
-
-	_$_.append(__anchor, div_1);
-	_$_.pop_component();
 }
 
-export function ReactiveTitle(__anchor, _, __block) {
-	_$_.push_component();
-
-	let lazy = _$_.track('Initial Title', __block, 'cbca63e3');
-	var div_2 = root_1();
-
-	{
-		var span_1 = _$_.child(div_2);
+export function ReactiveTitle() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		let lazy = _$_.track('Initial Title', __block, 'cbca63e3');
+		var div_2 = root_1();
 
 		{
-			var expression = _$_.child(span_1);
+			var span_1 = _$_.child(div_2);
+
+			{
+				var expression = _$_.child(span_1);
 
-			_$_.expression(expression, () => lazy.value);
-			_$_.pop(span_1);
+				_$_.expression(expression, () => lazy.value);
+				_$_.pop(span_1);
+			}
 		}
-	}
 
-	_$_.head('8af28792', (__anchor) => {
-		_$_.render(() => {
-			_$_.document.title = lazy.value;
+		_$_.head('13811860', (__anchor) => {
+			_$_.render(() => {
+				_$_.document.title = lazy.value;
+			});
 		});
-	});
 
-	_$_.append(__anchor, div_2);
-	_$_.pop_component();
+		_$_.append(__anchor, div_2);
+	});
 }
 
-export function MultipleHeadElements(__anchor, _, __block) {
-	_$_.push_component();
+export function MultipleHeadElements() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		var div_3 = root_2();
 
-	var div_3 = root_2();
+		_$_.head('478d48ee', (__anchor) => {
+			var fragment = root_3();
 
-	_$_.head('3a79945b', (__anchor) => {
-		var fragment = root_3();
+			_$_.document.title = 'Page Title';
+			_$_.next();
+			_$_.append(__anchor, fragment, true);
+		});
 
-		_$_.document.title = 'Page Title';
-		_$_.next();
-		_$_.append(__anchor, fragment, true);
+		_$_.append(__anchor, div_3);
 	});
-
-	_$_.append(__anchor, div_3);
-	_$_.pop_component();
 }
 
-export function ReactiveMetaTags(__anchor, _, __block) {
-	_$_.push_component();
+export function ReactiveMetaTags() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		let lazy_1 = _$_.track('Initial description', __block, '38bfa3b2');
+		var div_4 = root_4();
 
-	let lazy_1 = _$_.track('Initial description', __block, '38bfa3b2');
-	var div_4 = root_4();
+		{
+			var expression_1 = _$_.child(div_4);
 
-	{
-		var expression_1 = _$_.child(div_4);
+			_$_.expression(expression_1, () => lazy_1.value);
+			_$_.pop(div_4);
+		}
 
-		_$_.expression(expression_1, () => lazy_1.value);
-		_$_.pop(div_4);
-	}
+		_$_.head('36dd8c9f', (__anchor) => {
+			var meta_1 = root_5();
 
-	_$_.head('c9fd7b0f', (__anchor) => {
-		var meta_1 = root_5();
+			_$_.document.title = 'My Page';
+			_$_.set_attribute(meta_1, 'content');
+			_$_.append(__anchor, meta_1);
+		});
 
-		_$_.document.title = 'My Page';
-		_$_.set_attribute(meta_1, 'content');
-		_$_.append(__anchor, meta_1);
+		_$_.append(__anchor, div_4);
 	});
-
-	_$_.append(__anchor, div_4);
-	_$_.pop_component();
 }
 
-export function TitleWithTemplate(__anchor, _, __block) {
-	_$_.push_component();
-
-	let lazy_2 = _$_.track('World', __block, 'f3925cd5');
-	var div_5 = root_6();
+export function TitleWithTemplate() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		let lazy_2 = _$_.track('World', __block, 'f3925cd5');
+		var div_5 = root_6();
 
-	{
-		var expression_2 = _$_.child(div_5);
+		{
+			var expression_2 = _$_.child(div_5);
 
-		_$_.expression(expression_2, () => lazy_2.value);
-		_$_.pop(div_5);
-	}
+			_$_.expression(expression_2, () => lazy_2.value);
+			_$_.pop(div_5);
+		}
 
-	_$_.head('72f81455', (__anchor) => {
-		_$_.render(() => {
-			_$_.document.title = `Hello ${lazy_2.value}!`;
+		_$_.head('bf58d07e', (__anchor) => {
+			_$_.render(() => {
+				_$_.document.title = `Hello ${lazy_2.value}!`;
+			});
 		});
-	});
 
-	_$_.append(__anchor, div_5);
-	_$_.pop_component();
+		_$_.append(__anchor, div_5);
+	});
 }
 
-export function EmptyTitle(__anchor, _, __block) {
-	_$_.push_component();
+export function EmptyTitle() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		var div_6 = root_7();
 
-	var div_6 = root_7();
+		_$_.head('146bbd6b', (__anchor) => {
+			_$_.document.title = '';
+		});
 
-	_$_.head('35a7fe4a', (__anchor) => {
-		_$_.document.title = '';
+		_$_.append(__anchor, div_6);
 	});
-
-	_$_.append(__anchor, div_6);
-	_$_.pop_component();
 }
 
-export function ConditionalTitle(__anchor, _, __block) {
-	_$_.push_component();
-
-	let lazy_3 = _$_.track(true, __block, 'ff71bf1f');
-	let lazy_4 = _$_.track('Main Page', __block, '7cd7d671');
-	var div_7 = root_8();
+export function ConditionalTitle() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		let lazy_3 = _$_.track(true, __block, 'ff71bf1f');
+		let lazy_4 = _$_.track('Main Page', __block, '7cd7d671');
+		var div_7 = root_8();
 
-	{
-		var expression_3 = _$_.child(div_7);
+		{
+			var expression_3 = _$_.child(div_7);
 
-		_$_.expression(expression_3, () => lazy_4.value);
-		_$_.pop(div_7);
-	}
+			_$_.expression(expression_3, () => lazy_4.value);
+			_$_.pop(div_7);
+		}
 
-	_$_.head('453e9ed4', (__anchor) => {
-		_$_.render(() => {
-			_$_.document.title = lazy_3.value ? 'App - ' + lazy_4.value : lazy_4.value;
+		_$_.head('79341264', (__anchor) => {
+			_$_.render(() => {
+				_$_.document.title = lazy_3.value ? 'App - ' + lazy_4.value : lazy_4.value;
+			});
 		});
-	});
 
-	_$_.append(__anchor, div_7);
-	_$_.pop_component();
+		_$_.append(__anchor, div_7);
+	});
 }
 
-export function ComputedTitle(__anchor, _, __block) {
-	_$_.push_component();
-
-	let lazy_5 = _$_.track(0, __block, 'b6a48610');
-	let prefix = 'Count: ';
-	var div_8 = root_9();
-
-	{
-		var span_2 = _$_.child(div_8);
+export function ComputedTitle() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		let lazy_5 = _$_.track(0, __block, 'b6a48610');
+		let prefix = 'Count: ';
+		var div_8 = root_9();
 
 		{
-			var expression_4 = _$_.child(span_2);
+			var span_2 = _$_.child(div_8);
 
-			_$_.expression(expression_4, () => lazy_5.value);
-			_$_.pop(span_2);
+			{
+				var expression_4 = _$_.child(span_2);
+
+				_$_.expression(expression_4, () => lazy_5.value);
+				_$_.pop(span_2);
+			}
 		}
-	}
 
-	_$_.head('63888c83', (__anchor) => {
-		_$_.render(() => {
-			_$_.document.title = prefix + lazy_5.value;
+		_$_.head('624d9ef2', (__anchor) => {
+			_$_.render(() => {
+				_$_.document.title = prefix + lazy_5.value;
+			});
 		});
-	});
 
-	_$_.append(__anchor, div_8);
-	_$_.pop_component();
+		_$_.append(__anchor, div_8);
+	});
 }
 
-export function MultipleHeadBlocks(__anchor, _, __block) {
-	_$_.push_component();
+export function MultipleHeadBlocks() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		var div_9 = root_10();
 
-	var div_9 = root_10();
+		_$_.head('111100ce', (__anchor) => {
+			_$_.document.title = 'First Head';
+		});
 
-	_$_.head('43cf39fd', (__anchor) => {
-		_$_.document.title = 'First Head';
-	});
+		_$_.head('423883ee', (__anchor) => {
+			var meta_2 = root_11();
 
-	_$_.head('e9abd92f', (__anchor) => {
-		var meta_2 = root_11();
+			_$_.append(__anchor, meta_2);
+		});
 
-		_$_.append(__anchor, meta_2);
+		_$_.append(__anchor, div_9);
 	});
-
-	_$_.append(__anchor, div_9);
-	_$_.pop_component();
 }
 
-export function HeadWithStyle(__anchor, _, __block) {
-	_$_.push_component();
+export function HeadWithStyle() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		var div_10 = root_12();
 
-	var div_10 = root_12();
+		_$_.head('f3524d73', (__anchor) => {
+			_$_.document.title = 'Styled Page';
+		});
 
-	_$_.head('d246667e', (__anchor) => {
-		_$_.document.title = 'Styled Page';
+		_$_.append(__anchor, div_10);
 	});
-
-	_$_.append(__anchor, div_10);
-	_$_.pop_component();
 }

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

@@ -9,75 +9,68 @@ var root_3 = _$_.template(`<!>`, 1, 1);
 
 import { track } from 'ripple';
 
-export function Layout(__anchor, { children }, __block) {
-	_$_.push_component();
-
-	var div_1 = root();
-
-	{
-		var nav_1 = _$_.child(div_1);
-		var main_1 = _$_.sibling(nav_1);
+export function Layout({ children }) {
+	return _$_.tsrx_element((__anchor, __block) => {
+		var div_1 = root();
 
 		{
-			var expression = _$_.child(main_1);
+			var nav_1 = _$_.child(div_1);
+			var main_1 = _$_.sibling(nav_1);
 
-			_$_.expression(expression, () => children);
-			_$_.pop(main_1);
+			{
+				var expression = _$_.child(main_1);
+
+				_$_.expression(expression, () => children);
+				_$_.pop(main_1);
+			}
 		}
-	}
 
-	_$_.append(__anchor, div_1);
-	_$_.pop_component();
+		_$_.append(__anchor, div_1);
+	});
 }
 
-export function Content(__anchor, _, __block) {
-	_$_.push_component();
+export function Content() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		let lazy = _$_.track(true, __block, '0bdb1500');
+		var div_2 = root_1();
 
-	let lazy = _$_.track(true, __block, '0bdb1500');
-	var div_2 = root_1();
+		{
+			var node = _$_.child(div_2);
 
-	{
-		var node = _$_.child(div_2);
+			{
+				var consequent = (__anchor) => {
+					var p_1 = root_2();
 
-		{
-			var consequent = (__anchor) => {
-				var p_1 = root_2();
+					_$_.append(__anchor, p_1);
+				};
 
-				_$_.append(__anchor, p_1);
-			};
+				_$_.if(node, (__render) => {
+					if (lazy.value) __render(consequent);
+				});
+			}
 
-			_$_.if(node, (__render) => {
-				if (lazy.value) __render(consequent);
-			});
+			_$_.pop(div_2);
 		}
 
-		_$_.pop(div_2);
-	}
-
-	_$_.append(__anchor, div_2);
-	_$_.pop_component();
+		_$_.append(__anchor, div_2);
+	});
 }
 
-export function LayoutWithContent(__anchor, _, __block) {
-	_$_.push_component();
+export function LayoutWithContent() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		var fragment = root_3();
+		var node_1 = _$_.first_child_frag(fragment);
 
-	var fragment = root_3();
-	var node_1 = _$_.first_child_frag(fragment);
-
-	Layout(
-		node_1,
-		{
-			children: _$_.tsrx_element(function render_children(__anchor, __block) {
+		_$_.render_component(Layout, node_1, {
+			children: _$_.tsrx_element((__anchor, __block) => {
 				var fragment_1 = root_4();
 				var node_2 = _$_.first_child_frag(fragment_1);
 
-				Content(node_2, {}, _$_.active_block);
+				_$_.render_component(Content, node_2, {});
 				_$_.append(__anchor, fragment_1);
 			})
-		},
-		_$_.active_block
-	);
+		});
 
-	_$_.append(__anchor, fragment);
-	_$_.pop_component();
+		_$_.append(__anchor, fragment);
+	});
 }

package/tests/hydration/compiled/client/html-in-template.js

@@ -6,59 +6,56 @@ var root_1 = _$_.template(`<template id="data2"></template>`, 0);
 var root_3 = _$_.template(`<span class="inside">inside</span>`, 0);
 var root_2 = _$_.template(`<div><template id="before"></template><!><template id="after"></template></div>`, 0);
 
-export function SimpleTemplateHtml(__anchor, _, __block) {
-	_$_.push_component();
-
-	const data = 'test data';
-	var template_1 = root();
-
-	template_1.innerHTML = data;
-	_$_.append(__anchor, template_1);
-	_$_.pop_component();
+export function SimpleTemplateHtml() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		const data = 'test data';
+		var template_1 = root();
+
+		template_1.innerHTML = data ?? template_1.innerHTML;
+		_$_.append(__anchor, template_1);
+	});
 }
 
-export function TemplateWithJSON(__anchor, _, __block) {
-	_$_.push_component();
+export function TemplateWithJSON() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		const jsonData = _$_.with_scope(__block, () => JSON.stringify({ message: 'hello', count: 42 }));
+		var template_2 = root_1();
 
-	const jsonData = _$_.with_scope(__block, () => JSON.stringify({ message: 'hello', count: 42 }));
-	var template_2 = root_1();
-
-	template_2.innerHTML = jsonData;
-	_$_.append(__anchor, template_2);
-	_$_.pop_component();
+		template_2.innerHTML = jsonData ?? template_2.innerHTML;
+		_$_.append(__anchor, template_2);
+	});
 }
 
-export function TemplateAroundIfBlock(__anchor, _, __block) {
-	_$_.push_component();
-
-	const show = true;
-	var div_1 = root_2();
+export function TemplateAroundIfBlock() {
+	return _$_.tsrx_element((__anchor, __block) => {
+		const show = true;
+		var div_1 = root_2();
 
-	{
-		var template_3 = _$_.child(div_1);
+		{
+			var template_3 = _$_.child(div_1);
 
-		template_3.innerHTML = 'before';
+			template_3.innerHTML = "before" ?? template_3.innerHTML;
 
-		var node = _$_.sibling(template_3);
+			var node = _$_.sibling(template_3);
 
-		{
-			var consequent = (__anchor) => {
-				var span_1 = root_3();
+			{
+				var consequent = (__anchor) => {
+					var span_1 = root_3();
 
-				_$_.append(__anchor, span_1);
-			};
+					_$_.append(__anchor, span_1);
+				};
 
-			_$_.if(node, (__render) => {
-				if (show) __render(consequent);
-			});
-		}
+				_$_.if(node, (__render) => {
+					if (show) __render(consequent);
+				});
+			}
 
-		var template_4 = _$_.sibling(node);
+			var template_4 = _$_.sibling(node);
 
-		template_4.innerHTML = 'after';
-		_$_.pop(div_1);
-	}
+			template_4.innerHTML = "after" ?? template_4.innerHTML;
+			_$_.pop(div_1);
+		}
 
-	_$_.append(__anchor, div_1);
-	_$_.pop_component();
+		_$_.append(__anchor, div_1);
+	});
 }