ripple 0.3.7 → 0.3.8

package/tests/hydration/compiled/server/if-children.js

@@ -7,7 +7,7 @@ export async function IfWithChildren(__output, { children }) {
 	return _$_.async(async () => {
 		_$_.push_component();
 
-		let expanded = _$_.track(true);
+		let lazy = _$_.track(true);
 
 		__output.push('<div');
 		__output.push(' class="container"');
@@ -26,7 +26,7 @@ export async function IfWithChildren(__output, { children }) {
 			__output.push('</div>');
 			__output.push('<!--[-->');
 
-			if (_$_.get(expanded)) {
+			if (_$_.get(lazy)) {
 				__output.push('<div');
 				__output.push(' class="content"');
 				__output.push('>');
@@ -111,7 +111,7 @@ export function TestIfWithChildren(__output) {
 export function IfWithStaticChildren(__output) {
 	_$_.push_component();
 
-	let expanded = _$_.track(true);
+	let lazy_1 = _$_.track(true);
 
 	__output.push('<div');
 	__output.push(' class="container"');
@@ -130,7 +130,7 @@ export function IfWithStaticChildren(__output) {
 		__output.push('</div>');
 		__output.push('<!--[-->');
 
-		if (_$_.get(expanded)) {
+		if (_$_.get(lazy_1)) {
 			__output.push('<div');
 			__output.push(' class="content"');
 			__output.push('>');
@@ -168,7 +168,7 @@ export async function IfWithSiblingsAndChildren(__output, { children }) {
 	return _$_.async(async () => {
 		_$_.push_component();
 
-		let expanded = _$_.track(true);
+		let lazy_2 = _$_.track(true);
 
 		__output.push('<section');
 		__output.push(' class="group"');
@@ -222,7 +222,7 @@ export async function IfWithSiblingsAndChildren(__output, { children }) {
 			__output.push('</div>');
 			__output.push('<!--[-->');
 
-			if (_$_.get(expanded)) {
+			if (_$_.get(lazy_2)) {
 				__output.push('<div');
 				__output.push(' class="items"');
 				__output.push('>');
@@ -293,7 +293,7 @@ export function TestIfWithSiblingsAndChildren(__output) {
 export function ElementWithChildrenThenIf(__output) {
 	_$_.push_component();
 
-	let show = _$_.track(true);
+	let lazy_3 = _$_.track(true);
 
 	__output.push('<div');
 	__output.push(' class="wrapper"');
@@ -327,7 +327,7 @@ export function ElementWithChildrenThenIf(__output) {
 		__output.push('</div>');
 		__output.push('<!--[-->');
 
-		if (_$_.get(show)) {
+		if (_$_.get(lazy_3)) {
 			__output.push('<div');
 			__output.push(' class="conditional"');
 			__output.push('>');
@@ -358,7 +358,7 @@ export function ElementWithChildrenThenIf(__output) {
 export function DeepNestingThenIf(__output) {
 	_$_.push_component();
 
-	let visible = _$_.track(true);
+	let lazy_4 = _$_.track(true);
 
 	__output.push('<section');
 	__output.push(' class="outer"');
@@ -407,7 +407,7 @@ export function DeepNestingThenIf(__output) {
 		__output.push('</article>');
 		__output.push('<!--[-->');
 
-		if (_$_.get(visible)) {
+		if (_$_.get(lazy_4)) {
 			__output.push('<footer');
 			__output.push(' class="footer"');
 			__output.push('>');
@@ -438,7 +438,7 @@ export function DeepNestingThenIf(__output) {
 export function DomElementChildrenThenSibling(__output) {
 	_$_.push_component();
 
-	let activeTab = _$_.track('code');
+	let lazy_5 = _$_.track('code');
 
 	__output.push('<div');
 	__output.push(' class="tabs"');
@@ -451,7 +451,7 @@ export function DomElementChildrenThenSibling(__output) {
 
 		{
 			__output.push('<button');
-			__output.push(_$_.attr('aria-selected', _$_.get(activeTab) === 'code' ? 'true' : 'false', false));
+			__output.push(_$_.attr('aria-selected', _$_.get(lazy_5) === 'code' ? 'true' : 'false', false));
 			__output.push(' class="tab"');
 			__output.push('>');
 
@@ -461,7 +461,7 @@ export function DomElementChildrenThenSibling(__output) {
 
 			__output.push('</button>');
 			__output.push('<button');
-			__output.push(_$_.attr('aria-selected', _$_.get(activeTab) === 'preview' ? 'true' : 'false', false));
+			__output.push(_$_.attr('aria-selected', _$_.get(lazy_5) === 'preview' ? 'true' : 'false', false));
 			__output.push(' class="tab"');
 			__output.push('>');
 
@@ -480,7 +480,7 @@ export function DomElementChildrenThenSibling(__output) {
 		{
 			__output.push('<!--[-->');
 
-			if (_$_.get(activeTab) === 'code') {
+			if (_$_.get(lazy_5) === 'code') {
 				__output.push('<pre');
 				__output.push(' class="code"');
 				__output.push('>');
@@ -515,7 +515,7 @@ export function DomElementChildrenThenSibling(__output) {
 export function DomChildrenThenStaticSiblings(__output) {
 	_$_.push_component();
 
-	let count = _$_.track(0);
+	let lazy_6 = _$_.track(0);
 
 	__output.push('<div');
 	__output.push(' class="container"');
@@ -532,7 +532,7 @@ export function DomChildrenThenStaticSiblings(__output) {
 			__output.push('>');
 
 			{
-				__output.push(_$_.escape('Item count: ' + String(_$_.get(count))));
+				__output.push(_$_.escape('Item count: ' + String(_$_.get(lazy_6))));
 			}
 
 			__output.push('</li>');

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

@@ -85,7 +85,7 @@ export function IfElse(__output) {
 export function ReactiveIf(__output) {
 	_$_.push_component();
 
-	let show = _$_.track(true);
+	let lazy = _$_.track(true);
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -98,7 +98,7 @@ export function ReactiveIf(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(show)) {
+	if (_$_.get(lazy)) {
 		__output.push('<div');
 		__output.push(' class="content"');
 		__output.push('>');
@@ -117,7 +117,7 @@ export function ReactiveIf(__output) {
 export function ReactiveIfElse(__output) {
 	_$_.push_component();
 
-	let isOn = _$_.track(false);
+	let lazy_1 = _$_.track(false);
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -130,7 +130,7 @@ export function ReactiveIfElse(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(isOn)) {
+	if (_$_.get(lazy_1)) {
 		__output.push('<div');
 		__output.push(' class="on"');
 		__output.push('>');
@@ -159,8 +159,8 @@ export function ReactiveIfElse(__output) {
 export function NestedIf(__output) {
 	_$_.push_component();
 
-	let outer = _$_.track(true);
-	let inner = _$_.track(true);
+	let lazy_2 = _$_.track(true);
+	let lazy_3 = _$_.track(true);
 
 	__output.push('<button');
 	__output.push(' class="outer-toggle"');
@@ -182,7 +182,7 @@ export function NestedIf(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(outer)) {
+	if (_$_.get(lazy_2)) {
 		__output.push('<div');
 		__output.push(' class="outer-content"');
 		__output.push('>');
@@ -191,7 +191,7 @@ export function NestedIf(__output) {
 			__output.push('Outer');
 			__output.push('<!--[-->');
 
-			if (_$_.get(inner)) {
+			if (_$_.get(lazy_3)) {
 				__output.push('<span');
 				__output.push(' class="inner-content"');
 				__output.push('>');
@@ -216,7 +216,7 @@ export function NestedIf(__output) {
 export function IfElseIfChain(__output) {
 	_$_.push_component();
 
-	let status = _$_.track('loading');
+	let lazy_4 = _$_.track('loading');
 
 	__output.push('<div');
 	__output.push('>');
@@ -251,7 +251,7 @@ export function IfElseIfChain(__output) {
 		__output.push('</button>');
 		__output.push('<!--[-->');
 
-		if (_$_.get(status) === 'loading') {
+		if (_$_.get(lazy_4) === 'loading') {
 			__output.push('<div');
 			__output.push(' class="state"');
 			__output.push('>');
@@ -264,7 +264,7 @@ export function IfElseIfChain(__output) {
 		} else {
 			__output.push('<!--[-->');
 
-			if (_$_.get(status) === 'success') {
+			if (_$_.get(lazy_4) === 'success') {
 				__output.push('<div');
 				__output.push(' class="state"');
 				__output.push('>');

package/tests/hydration/compiled/server/mixed-control-flow.js

@@ -97,9 +97,9 @@ export async function MixedControlFlowReactive(__output) {
 	return _$_.async(async () => {
 		_$_.push_component();
 
-		let show = _$_.track(true);
-		let mode = _$_.track('a');
-		let items = _$_.track([{ id: 1, label: 'One' }, { id: 2, label: 'Two' }]);
+		let lazy = _$_.track(true);
+		let lazy_1 = _$_.track('a');
+		let lazy_2 = _$_.track([{ id: 1, label: 'One' }, { id: 2, label: 'Two' }]);
 
 		__output.push('<button');
 		__output.push(' class="toggle-show"');
@@ -130,7 +130,7 @@ export async function MixedControlFlowReactive(__output) {
 		__output.push('</button>');
 		__output.push('<!--[-->');
 
-		if (_$_.get(show)) {
+		if (_$_.get(lazy)) {
 			__output.push('<div');
 			__output.push(' class="mixed-reactive-list"');
 			__output.push('>');
@@ -138,10 +138,10 @@ export async function MixedControlFlowReactive(__output) {
 			{
 				__output.push('<!--[-->');
 
-				for (const item of _$_.get(items)) {
+				for (const item of _$_.get(lazy_2)) {
 					__output.push('<!--[-->');
 
-					switch (_$_.get(mode)) {
+					switch (_$_.get(lazy_1)) {
 						case 'a':
 							__output.push('<!--[-->');
 							var __pending_pos_2 = __output.body.length;

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

@@ -62,7 +62,7 @@ export async function ConditionalPortal(__output) {
 	return _$_.async(async () => {
 		_$_.push_component();
 
-		let show = _$_.track(true);
+		let lazy = _$_.track(true);
 
 		__output.push('<div');
 		__output.push(' class="container"');
@@ -80,7 +80,7 @@ export async function ConditionalPortal(__output) {
 			__output.push('</button>');
 			__output.push('<!--[-->');
 
-			if (_$_.get(show)) {
+			if (_$_.get(lazy)) {
 				{
 					const comp = Portal;
 

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

@@ -6,14 +6,14 @@ import { track } from 'ripple/server';
 export function TrackedState(__output) {
 	_$_.push_component();
 
-	let count = _$_.track(0);
+	let lazy = _$_.track(0);
 
 	__output.push('<div');
 	__output.push(' class="count"');
 	__output.push('>');
 
 	{
-		__output.push(_$_.escape(_$_.get(count)));
+		__output.push(_$_.escape(_$_.get(lazy)));
 	}
 
 	__output.push('</div>');
@@ -23,7 +23,7 @@ export function TrackedState(__output) {
 export function CounterWithInitial(__output, props) {
 	_$_.push_component();
 
-	let count = _$_.track(props.initial);
+	let lazy_1 = _$_.track(props.initial);
 
 	__output.push('<div');
 	__output.push('>');
@@ -34,7 +34,7 @@ export function CounterWithInitial(__output, props) {
 		__output.push('>');
 
 		{
-			__output.push(_$_.escape(_$_.get(count)));
+			__output.push(_$_.escape(_$_.get(lazy_1)));
 		}
 
 		__output.push('</span>');
@@ -60,9 +60,9 @@ export function CounterWrapper(__output) {
 export function ComputedValues(__output) {
 	_$_.push_component();
 
-	let a = _$_.track(2);
-	let b = _$_.track(3);
-	const sum = () => _$_.get(a) + _$_.get(b);
+	let lazy_2 = _$_.track(2);
+	let lazy_3 = _$_.track(3);
+	const sum = () => _$_.get(lazy_2) + _$_.get(lazy_3);
 
 	__output.push('<div');
 	__output.push(' class="sum"');
@@ -79,16 +79,16 @@ export function ComputedValues(__output) {
 export function MultipleTracked(__output) {
 	_$_.push_component();
 
-	let x = _$_.track(10);
-	let y = _$_.track(20);
-	let z = _$_.track(30);
+	let lazy_4 = _$_.track(10);
+	let lazy_5 = _$_.track(20);
+	let lazy_6 = _$_.track(30);
 
 	__output.push('<div');
 	__output.push(' class="x"');
 	__output.push('>');
 
 	{
-		__output.push(_$_.escape(_$_.get(x)));
+		__output.push(_$_.escape(_$_.get(lazy_4)));
 	}
 
 	__output.push('</div>');
@@ -97,7 +97,7 @@ export function MultipleTracked(__output) {
 	__output.push('>');
 
 	{
-		__output.push(_$_.escape(_$_.get(y)));
+		__output.push(_$_.escape(_$_.get(lazy_5)));
 	}
 
 	__output.push('</div>');
@@ -106,7 +106,7 @@ export function MultipleTracked(__output) {
 	__output.push('>');
 
 	{
-		__output.push(_$_.escape(_$_.get(z)));
+		__output.push(_$_.escape(_$_.get(lazy_6)));
 	}
 
 	__output.push('</div>');
@@ -116,9 +116,9 @@ export function MultipleTracked(__output) {
 export function DerivedState(__output) {
 	_$_.push_component();
 
-	let firstName = _$_.track('John');
-	let lastName = _$_.track('Doe');
-	const fullName = () => `${_$_.get(firstName)} ${_$_.get(lastName)}`;
+	let lazy_7 = _$_.track('John');
+	let lazy_8 = _$_.track('Doe');
+	const fullName = () => `${_$_.get(lazy_7)} ${_$_.get(lazy_8)}`;
 
 	__output.push('<div');
 	__output.push(' class="name"');

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

@@ -1034,7 +1034,7 @@ export function ReactiveReturnTrueToFalse(__output) {
 	_$_.push_component();
 
 	var __r_28 = false;
-	let condition = _$_.track(true);
+	let lazy = _$_.track(true);
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -1047,7 +1047,7 @@ export function ReactiveReturnTrueToFalse(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(condition)) {
+	if (_$_.get(lazy)) {
 		__output.push('<div');
 		__output.push(' class="guard"');
 		__output.push('>');
@@ -1083,7 +1083,7 @@ export function ReactiveReturnFalseToTrue(__output) {
 	_$_.push_component();
 
 	var __r_29 = false;
-	let condition = _$_.track(false);
+	let lazy_1 = _$_.track(false);
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -1096,7 +1096,7 @@ export function ReactiveReturnFalseToTrue(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(condition)) {
+	if (_$_.get(lazy_1)) {
 		__output.push('<div');
 		__output.push(' class="guard"');
 		__output.push('>');
@@ -1133,7 +1133,7 @@ export function ReactiveNestedReturn(__output) {
 
 	var __r_30 = false;
 	let a = true;
-	let b = _$_.track(true);
+	let lazy_2 = _$_.track(true);
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -1158,7 +1158,7 @@ export function ReactiveNestedReturn(__output) {
 		__output.push('</div>');
 		__output.push('<!--[-->');
 
-		if (_$_.get(b)) {
+		if (_$_.get(lazy_2)) {
 			__output.push('<div');
 			__output.push(' class="b"');
 			__output.push('>');
@@ -1507,7 +1507,7 @@ export function ReactiveSiblingReturns(__output) {
 
 	var __r_38 = false;
 	var __r_39 = false;
-	let mode = _$_.track('first');
+	let lazy_3 = _$_.track('first');
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -1520,7 +1520,7 @@ export function ReactiveSiblingReturns(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(mode) === 'first') {
+	if (_$_.get(lazy_3) === 'first') {
 		__output.push('<div');
 		__output.push(' class="first"');
 		__output.push('>');
@@ -1539,7 +1539,7 @@ export function ReactiveSiblingReturns(__output) {
 	if (!__r_38) {
 		__output.push('<!--[-->');
 
-		if (_$_.get(mode) === 'second') {
+		if (_$_.get(lazy_3) === 'second') {
 			__output.push('<div');
 			__output.push(' class="second"');
 			__output.push('>');
@@ -1578,8 +1578,8 @@ export function ReactiveOuterInnerReturns(__output) {
 	_$_.push_component();
 
 	var __r_40 = false;
-	let a = _$_.track(true);
-	let b = _$_.track(true);
+	let lazy_4 = _$_.track(true);
+	let lazy_5 = _$_.track(true);
 
 	__output.push('<button');
 	__output.push(' class="toggle-a"');
@@ -1601,7 +1601,7 @@ export function ReactiveOuterInnerReturns(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(a)) {
+	if (_$_.get(lazy_4)) {
 		__output.push('<div');
 		__output.push(' class="a"');
 		__output.push('>');
@@ -1613,7 +1613,7 @@ export function ReactiveOuterInnerReturns(__output) {
 		__output.push('</div>');
 		__output.push('<!--[-->');
 
-		if (_$_.get(b)) {
+		if (_$_.get(lazy_5)) {
 			__output.push('<div');
 			__output.push(' class="b"');
 			__output.push('>');
@@ -1638,7 +1638,7 @@ export function ReactiveOuterInnerReturns(__output) {
 		__output.push('>');
 
 		{
-			__output.push(_$_.escape(_$_.get(a) ? 'a-on rest' : 'a-off rest'));
+			__output.push(_$_.escape(_$_.get(lazy_4) ? 'a-on rest' : 'a-off rest'));
 		}
 
 		__output.push('</div>');
@@ -1653,7 +1653,7 @@ export function ReactiveElseIfReturns(__output) {
 
 	var __r_41 = false;
 	var __r_42 = false;
-	let status = _$_.track(0);
+	let lazy_6 = _$_.track(0);
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -1666,7 +1666,7 @@ export function ReactiveElseIfReturns(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(status) === 0) {
+	if (_$_.get(lazy_6) === 0) {
 		__output.push('<div');
 		__output.push(' class="zero"');
 		__output.push('>');
@@ -1680,7 +1680,7 @@ export function ReactiveElseIfReturns(__output) {
 	} else {
 		__output.push('<!--[-->');
 
-		if (_$_.get(status) === 1) {
+		if (_$_.get(lazy_6) === 1) {
 			__output.push('<div');
 			__output.push(' class="one"');
 			__output.push('>');
@@ -1731,10 +1731,10 @@ export function ReactiveDeepNestedIndependentReturns(__output) {
 	var __r_44 = false;
 	var __r_45 = false;
 	var __r_46 = false;
-	let c1 = _$_.track(false);
-	let c2 = _$_.track(false);
-	let c3 = _$_.track(false);
-	let c4 = _$_.track(false);
+	let lazy_7 = _$_.track(false);
+	let lazy_8 = _$_.track(false);
+	let lazy_9 = _$_.track(false);
+	let lazy_10 = _$_.track(false);
 
 	__output.push('<button');
 	__output.push(' class="toggle-c1"');
@@ -1783,7 +1783,7 @@ export function ReactiveDeepNestedIndependentReturns(__output) {
 	__output.push('</div>');
 	__output.push('<!--[-->');
 
-	if (_$_.get(c1)) {
+	if (_$_.get(lazy_7)) {
 		__output.push('<div');
 		__output.push(' class="hit-1"');
 		__output.push('>');
@@ -1825,7 +1825,7 @@ export function ReactiveDeepNestedIndependentReturns(__output) {
 			__output.push('</div>');
 			__output.push('<!--[-->');
 
-			if (_$_.get(c2)) {
+			if (_$_.get(lazy_8)) {
 				__output.push('<div');
 				__output.push(' class="hit-2"');
 				__output.push('>');
@@ -1867,7 +1867,7 @@ export function ReactiveDeepNestedIndependentReturns(__output) {
 					__output.push('</div>');
 					__output.push('<!--[-->');
 
-					if (_$_.get(c3)) {
+					if (_$_.get(lazy_9)) {
 						__output.push('<div');
 						__output.push(' class="hit-3"');
 						__output.push('>');
@@ -1895,7 +1895,7 @@ export function ReactiveDeepNestedIndependentReturns(__output) {
 						__output.push('</div>');
 						__output.push('<!--[-->');
 
-						if (_$_.get(c4)) {
+						if (_$_.get(lazy_10)) {
 							__output.push('<div');
 							__output.push(' class="hit-4"');
 							__output.push('>');

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

@@ -48,7 +48,7 @@ export function SwitchStatic(__output) {
 export function SwitchReactive(__output) {
 	_$_.push_component();
 
-	let status = _$_.track('a');
+	let lazy = _$_.track('a');
 
 	__output.push('<button');
 	__output.push(' class="toggle"');
@@ -61,7 +61,7 @@ export function SwitchReactive(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	switch (_$_.get(status)) {
+	switch (_$_.get(lazy)) {
 		case 'a':
 			__output.push('<div');
 			__output.push(' class="case-a"');
@@ -133,7 +133,7 @@ export function SwitchFallthrough(__output) {
 export function SwitchNumericLevels(__output) {
 	_$_.push_component();
 
-	let level = _$_.track(1);
+	let lazy_1 = _$_.track(1);
 
 	__output.push('<button');
 	__output.push(' class="level-toggle"');
@@ -146,7 +146,7 @@ export function SwitchNumericLevels(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	switch (_$_.get(level)) {
+	switch (_$_.get(lazy_1)) {
 		case 1:
 			__output.push('<div');
 			__output.push(' class="level-1"');
@@ -185,7 +185,7 @@ export function SwitchNumericLevels(__output) {
 export function SwitchBlockScoped(__output) {
 	_$_.push_component();
 
-	let level = _$_.track(1);
+	let lazy_2 = _$_.track(1);
 
 	__output.push('<button');
 	__output.push(' class="block-toggle"');
@@ -198,7 +198,7 @@ export function SwitchBlockScoped(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	switch (_$_.get(level)) {
+	switch (_$_.get(lazy_2)) {
 		case 1:
 			__output.push('<div');
 			__output.push(' class="block-1"');
@@ -237,7 +237,7 @@ export function SwitchBlockScoped(__output) {
 export function SwitchNoBreak(__output) {
 	_$_.push_component();
 
-	let level = _$_.track(1);
+	let lazy_3 = _$_.track(1);
 
 	__output.push('<button');
 	__output.push(' class="nobreak-toggle"');
@@ -250,7 +250,7 @@ export function SwitchNoBreak(__output) {
 	__output.push('</button>');
 	__output.push('<!--[-->');
 
-	switch (_$_.get(level)) {
+	switch (_$_.get(lazy_3)) {
 		case 1:
 			__output.push('<div');
 			__output.push(' class="nobreak-1"');