ripple/tests/hydration/compiled/client/try.js

Ripple is an elegant TypeScript UI framework

// @ts-nocheck
import * as _$_ from 'ripple/internal/client';

var root_1 = _$_.template(`<!>`, 1, 1);
var root_2 = _$_.template(`<p class="loading">loading...</p>`, 0);
var root = _$_.template(`<!>`, 1, 1);
var root_4 = _$_.template(`<li> </li>`, 0);
var root_3 = _$_.template(`<ul class="items"></ul>`, 0);
var root_6 = _$_.template(`<!>`, 1, 1);
var root_7 = _$_.template(`<div class="loading">loading async content</div>`, 0);
var root_5 = _$_.template(`<div class="before">before</div><!>`, 1, 2);
var root_8 = _$_.template(`<div class="resolved"> </div>`, 0);

import { trackAsync } from 'ripple';

export function AsyncListInTryPending(__anchor, _, __block) {
	_$_.push_component();

	var fragment = root();
	var node = _$_.first_child_frag(fragment);

	_$_.try(
		node,
		(__anchor) => {
			var fragment_1 = root_1();
			var node_1 = _$_.first_child_frag(fragment_1);

			AsyncList(node_1, {}, _$_.active_block);
			_$_.append(__anchor, fragment_1);
		},
		null,
		(__anchor) => {
			var p_1 = root_2();

			_$_.append(__anchor, p_1);
		}
	);

	_$_.append(__anchor, fragment);
	_$_.pop_component();
}

function AsyncList(__anchor, _, __block) {
	_$_.push_component();

	let lazy = _$_.track_async(() => _$_.with_scope(__block, () => Promise.resolve(['alpha', 'beta', 'gamma'])), __block, 'd6bf9e33');
	var ul_1 = root_3();

	{
		_$_.for(
			ul_1,
			() => _$_.get(lazy),
			(__anchor, item) => {
				var li_1 = root_4();

				{
					var expression = _$_.child(li_1);

					_$_.expression(expression, () => item);
					_$_.pop(li_1);
				}

				_$_.append(__anchor, li_1);
			},
			4
		);

		_$_.pop(ul_1);
	}

	_$_.append(__anchor, ul_1);
	_$_.pop_component();
}

export function AsyncTryWithLeadingSibling(__anchor, _, __block) {
	_$_.push_component();

	var fragment_2 = root_5();
	var div_1 = _$_.first_child_frag(fragment_2);
	var node_2 = _$_.sibling(div_1);

	_$_.try(
		node_2,
		(__anchor) => {
			var fragment_3 = root_6();
			var node_3 = _$_.first_child_frag(fragment_3);

			AsyncContent(node_3, {}, _$_.active_block);
			_$_.append(__anchor, fragment_3);
		},
		null,
		(__anchor) => {
			var div_2 = root_7();

			_$_.append(__anchor, div_2);
		}
	);

	_$_.append(__anchor, fragment_2);
	_$_.pop_component();
}

function AsyncContent(__anchor, _, __block) {
	_$_.push_component();

	let lazy_1 = _$_.track_async(() => _$_.with_scope(__block, () => Promise.resolve('ready')), __block, 'd2fe7b64');
	var div_3 = root_8();

	{
		var expression_1 = _$_.child(div_3);

		_$_.expression(expression_1, () => _$_.get(lazy_1));
		_$_.pop(div_3);
	}

	_$_.append(__anchor, div_3);
	_$_.pop_component();
}