ripple
Version:
Ripple is an elegant TypeScript UI framework
2,177 lines • 55.1 kB
JavaScript
// @ts-nocheck
import * as _$_ from 'ripple/internal/client';
var root = _$_.template_el('div');
function StaticHtml_render(__anchor, __block) {
const html = '<p><strong>Bold</strong> text</p>';
var div = root();
div.innerHTML = html ?? div.innerHTML;
_$_.append(__anchor, div);
}
StaticHtml[_$_.$r] = StaticHtml_render;
var root_1 = _$_.template_el('div');
function DynamicHtml_render(__anchor, __block) {
const content = '<p>Dynamic <span>HTML</span> content</p>';
var div_1 = root_1();
div_1.innerHTML = content ?? div_1.innerHTML;
_$_.append(__anchor, div_1);
}
DynamicHtml[_$_.$r] = DynamicHtml_render;
var root_2 = _$_.template_el('div');
function EmptyHtml_render(__anchor, __block) {
const html = '';
var div_2 = root_2();
div_2.innerHTML = html ?? div_2.innerHTML;
_$_.append(__anchor, div_2);
}
EmptyHtml[_$_.$r] = EmptyHtml_render;
var root_3 = _$_.template_el('section');
function ComplexHtml_render(__anchor, __block) {
const html = '<div class="nested"><span>Nested <em>content</em></span></div>';
var section = root_3();
section.innerHTML = html ?? section.innerHTML;
_$_.append(__anchor, section);
}
ComplexHtml[_$_.$r] = ComplexHtml_render;
var root_4 = _$_.template_el('div', null, [null, null]);
function render(__prev) {
_$_.html(__prev._a, () => __prev._b);
_$_.html(__prev._c, () => __prev._d);
}
function MultipleHtml_render(__anchor, __block) {
const html1 = '<p>First paragraph</p>';
const html2 = '<p>Second paragraph</p>';
var div_3 = root_4();
{
var node = _$_.hydrating ? _$_.hydrate_child() : div_3.firstChild;
var node_1 = _$_.hydrating ? _$_.hydrate_sibling() : node.nextSibling;
_$_.hydrating && _$_.pop(div_3);
}
_$_.render(render, { _a: node, _b: html1, _c: node_1, _d: html2 });
_$_.append(__anchor, div_3);
}
MultipleHtml[_$_.$r] = MultipleHtml_render;
var root_5 = _$_.template_el('div', null, [null, ['button', null, 'Increment']]);
function render_1(__prev) {
_$_.html(__prev._a, () => "<p>Count: 0</p>");
}
function HtmlWithReactivity_render(__anchor, __block) {
var div_4 = root_5();
{
var node_2 = _$_.hydrating ? _$_.hydrate_child() : div_4.firstChild;
_$_.hydrating && _$_.pop(div_4);
}
_$_.render(render_1, { _a: node_2 });
_$_.append(__anchor, div_4);
}
HtmlWithReactivity[_$_.$r] = HtmlWithReactivity_render;
var root_6 = _$_.template_el('div', ['class', 'wrapper'], [['div', ['class', 'inner'], [null]]]);
function HtmlWrapper_render(__anchor, __block, { children }) {
var div_5 = root_6();
{
var div_6 = _$_.hydrating ? _$_.hydrate_child() : div_5.firstChild;
{
var expression = _$_.hydrating ? _$_.hydrate_child() : div_6.firstChild;
_$_.expression(expression, () => children);
_$_.hydrating && _$_.pop(div_6);
}
}
_$_.append(__anchor, div_5);
}
HtmlWrapper[_$_.$r] = HtmlWrapper_render;
var root_7 = _$_.template_el('div', ['class', 'vp-doc']);
function HtmlInChildren_render(__anchor, __block) {
const content = '<p><strong>Bold</strong> text</p>';
_$_.render_component(HtmlWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_7 = root_7();
div_7.innerHTML = content ?? div_7.innerHTML;
_$_.append(__anchor, div_7);
})
});
}
HtmlInChildren[_$_.$r] = HtmlInChildren_render;
var root_8 = _$_.template(`<h1>Title</h1><div class=content>`, 1, 2);
function HtmlInChildrenWithSiblings_render(__anchor, __block) {
const content = '<p>Dynamic content</p>';
_$_.render_component(HtmlWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment = root_8();
var h1 = _$_.first_child_frag(fragment);
var div_8 = _$_.hydrating ? _$_.hydrate_sibling() : h1.nextSibling;
div_8.innerHTML = content ?? div_8.innerHTML;
_$_.append(__anchor, fragment);
})
});
}
HtmlInChildrenWithSiblings[_$_.$r] = HtmlInChildrenWithSiblings_render;
var root_9 = _$_.template_el('div', ['class', 'doc'], [null, null]);
function render_2(__prev) {
_$_.html(__prev._a, () => __prev._b);
_$_.html(__prev._c, () => __prev._d);
}
function MultipleHtmlInChildren_render(__anchor, __block) {
const html1 = '<p>First</p>';
const html2 = '<p>Second</p>';
_$_.render_component(HtmlWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_9 = root_9();
{
var node_3 = _$_.hydrating ? _$_.hydrate_child() : div_9.firstChild;
var node_4 = _$_.hydrating ? _$_.hydrate_sibling() : node_3.nextSibling;
_$_.hydrating && _$_.pop(div_9);
}
_$_.render(render_2, { _a: node_3, _b: html1, _c: node_4, _d: html2 });
_$_.append(__anchor, div_9);
})
});
}
MultipleHtmlInChildren[_$_.$r] = MultipleHtmlInChildren_render;
var root_10 = _$_.template_el('div');
function HtmlWithComments_render(__anchor, __block) {
const content = '<p>Before comment</p><!-- TODO: Elaborate --><p>After comment</p>';
var div_10 = root_10();
div_10.innerHTML = content ?? div_10.innerHTML;
_$_.append(__anchor, div_10);
}
HtmlWithComments[_$_.$r] = HtmlWithComments_render;
var root_11 = _$_.template_el('div');
function HtmlWithEmptyComment_render(__anchor, __block) {
const content = '<p>Before</p><!----><p>After</p>';
var div_11 = root_11();
div_11.innerHTML = content ?? div_11.innerHTML;
_$_.append(__anchor, div_11);
}
HtmlWithEmptyComment[_$_.$r] = HtmlWithEmptyComment_render;
var root_12 = _$_.template_el('div', ['class', 'vp-doc']);
function HtmlWithCommentsInChildren_render(__anchor, __block) {
const content = '<h2 id="intro">Introduction</h2><p>Some text</p><!-- TODO --><p>More text</p>';
_$_.render_component(HtmlWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_12 = root_12();
div_12.innerHTML = content ?? div_12.innerHTML;
_$_.append(__anchor, div_12);
})
});
}
HtmlWithCommentsInChildren[_$_.$r] = HtmlWithCommentsInChildren_render;
var root_13 = _$_.template_el('footer', ['class', 'doc-footer'], 'Footer content');
function DocFooter_render(__anchor, __block) {
var footer = root_13();
_$_.append(__anchor, footer);
}
DocFooter[_$_.$r] = DocFooter_render;
var root_15 = _$_.template_el('div', ['class', 'edit-link'], [['a', null, 'Edit']]);
function consequent(__anchor, editPath) {
var div_16 = root_15();
{
var a = _$_.hydrating ? _$_.hydrate_child() : div_16.firstChild;
a.setAttribute('href', `https://github.com/edit/${editPath}`);
}
_$_.append(__anchor, div_16);
}
function if_1(editPath) {
if (editPath) return consequent;
}
var root_16 = _$_.template_el('nav', ['class', 'prev-next'], [['a', null, ' ']]);
function render_3(__prev) {
var __a = __prev._a.href;
if (__prev.a !== __a) {
_$_.set_attribute(__prev._b, 'href', __prev.a = __a);
}
}
function consequent_1(__anchor, nextLink) {
var nav = root_16();
{
var a_1 = _$_.hydrating ? _$_.hydrate_child() : nav.firstChild;
{
var expression_2 = _$_.hydrating ? _$_.hydrate_child() : a_1.firstChild;
_$_.expression(expression_2, () => nextLink.text);
_$_.hydrating && _$_.pop(a_1);
}
}
_$_.render(render_3, { a: void 0, _a: nextLink, _b: a_1 });
_$_.append(__anchor, nav);
}
function if_2(nextLink) {
if (nextLink) return consequent_1;
}
var root_18 = _$_.template_el('li', null, [['a']]);
function render_4(__prev) {
var __a = __prev._a.text;
if (__prev.a !== __a) {
_$_.set_text_content(__prev._b, __a, __prev.a);
__prev.a = __a;
}
var __b = __prev._a.href;
if (__prev.b !== __b) {
_$_.set_attribute(__prev._b, 'href', __prev.b = __b);
}
}
var root_17 = _$_.template_el('div', ['class', 'toc'], [['ul']]);
function consequent_2(__anchor, toc) {
var div_17 = root_17();
{
var ul = _$_.hydrating ? _$_.hydrate_child() : div_17.firstChild;
{
_$_.for(
ul,
() => toc,
(__anchor, item) => {
var li = root_18();
{
var a_2 = _$_.hydrating ? _$_.hydrate_child() : li.firstChild;
}
_$_.item({ a: '', b: void 0, _a: item, _b: a_2 });
_$_.append(__anchor, li);
},
4,
void 0,
render_4
);
_$_.hydrating && _$_.pop(ul);
}
}
_$_.append(__anchor, div_17);
}
function if_3(toc) {
if (toc.length > 0) return consequent_2;
}
var root_14 = _$_.template_el('div', ['class', 'layout'], [
[
'div',
['class', 'content-container'],
[['article', null, [['div', null, [null]]]]]
],
['aside', null, [null]]
]);
function render_5(__prev) {
var __a = if_3(__prev._a);
if (__prev.a !== __a) {
_$_.if_update(__prev._b, __prev.a = __a);
}
}
function DocLayout_render(
__anchor,
__block,
{ children, editPath = '', nextLink = null, toc = [] }
) {
var div_13 = root_14();
{
var div_14 = _$_.hydrating ? _$_.hydrate_child() : div_13.firstChild;
{
var article = _$_.hydrating ? _$_.hydrate_child() : div_14.firstChild;
{
var div_15 = _$_.hydrating ? _$_.hydrate_child() : article.firstChild;
{
var expression_1 = _$_.hydrating ? _$_.hydrate_child() : div_15.firstChild;
_$_.expression(expression_1, () => children);
_$_.hydrating && _$_.pop(div_15);
}
}
_$_.hydrating && _$_.pop(article);
var node_5 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_14);
_$_.if(node_5, if_1, false, editPath);
var node_6 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_14);
_$_.if(node_6, if_2, false, nextLink);
var node_7 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_14);
_$_.render_component(DocFooter, node_7, {});
_$_.hydrating && _$_.pop(div_14);
}
var aside = _$_.hydrating ? _$_.hydrate_sibling() : div_14.nextSibling;
{
var node_8 = _$_.hydrating ? _$_.hydrate_child() : aside.firstChild;
var ifs = _$_.if_static(node_8, if_3, 0, toc);
_$_.hydrating && _$_.pop(aside);
}
}
_$_.render(render_5, { a: _$_.UNINITIALIZED, _a: toc, _b: ifs });
_$_.append(__anchor, div_13);
}
DocLayout[_$_.$r] = DocLayout_render;
var root_19 = _$_.template_el('div', ['class', 'vp-doc']);
function HtmlWithServerData_render(__anchor, __block) {
const content = '<h1 id="intro" class="doc-h1">Introduction</h1><p>Ripple is a framework.</p>';
_$_.render_component(DocLayout, __anchor, {
editPath: "docs/introduction.md",
nextLink: { href: '/docs/quick-start', text: 'Quick Start' },
toc: [
{ href: '#intro', text: 'Introduction' },
{ href: '#features', text: 'Features' }
],
children: _$_.tsrx_element((__anchor, __block) => {
var div_18 = root_19();
div_18.innerHTML = content ?? div_18.innerHTML;
_$_.append(__anchor, div_18);
})
});
}
HtmlWithServerData[_$_.$r] = HtmlWithServerData_render;
var root_20 = _$_.template_el('div', ['class', 'vp-doc']);
function HtmlWithClientDefaults_render(__anchor, __block) {
const content = '<h1 id="intro" class="doc-h1">Introduction</h1><p>Ripple is a framework.</p>';
_$_.render_component(DocLayout, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_19 = root_20();
div_19.innerHTML = content ?? div_19.innerHTML;
_$_.append(__anchor, div_19);
})
});
}
HtmlWithClientDefaults[_$_.$r] = HtmlWithClientDefaults_render;
var root_21 = _$_.template_el('div', ['class', 'vp-doc']);
function HtmlWithUndefinedContent_render(__anchor, __block) {
const content = undefined;
_$_.render_component(DocLayout, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_20 = root_21();
div_20.innerHTML = content ?? div_20.innerHTML;
_$_.append(__anchor, div_20);
})
});
}
HtmlWithUndefinedContent[_$_.$r] = HtmlWithUndefinedContent_render;
var root_22 = _$_.template_el('h1', ['class', 'heading'], [null]);
var root_23 = _$_.template_el('h2', ['class', 'heading'], [null]);
function switch_case_0(__anchor, { a: level, b: children }) {
var h1_1 = root_22();
{
var expression_4 = _$_.hydrating ? _$_.hydrate_child() : h1_1.firstChild;
_$_.expression(expression_4, () => children);
_$_.hydrating && _$_.pop(h1_1);
}
_$_.append(__anchor, h1_1);
}
function switch_case_1(__anchor, { a: level, b: children }) {
var h2 = root_23();
{
var expression_5 = _$_.hydrating ? _$_.hydrate_child() : h2.firstChild;
_$_.expression(expression_5, () => children);
_$_.hydrating && _$_.pop(h2);
}
_$_.append(__anchor, h2);
}
function switch_1({ a: level, b: children }) {
switch (level) {
case 1:
return switch_case_0;
case 2:
return switch_case_1;
}
}
function DynamicHeading_render(__anchor, __block, { level, children }) {
_$_.switch(__anchor, switch_1, true, { a: level, b: children });
}
DynamicHeading[_$_.$r] = DynamicHeading_render;
var root_24 = _$_.template_el('div', ['class', 'code-block'], [
[
'div',
['class', 'header'],
[['button', null, 'Copy'], ['span', ['class', 'lang'], 'js']]
],
['div', ['class', 'content']]
]);
function CodeBlock_render(__anchor, __block, { code }) {
const highlighted = `<pre class="shiki"><code>${code}</code></pre>`;
var div_21 = root_24();
{
var div_23 = _$_.hydrating ? _$_.hydrate_child() : div_21.firstChild;
var div_22 = _$_.hydrating ? _$_.hydrate_sibling() : div_23.nextSibling;
div_22.innerHTML = highlighted ?? div_22.innerHTML;
}
_$_.append(__anchor, div_21);
}
CodeBlock[_$_.$r] = CodeBlock_render;
var root_25 = _$_.template_el('div', ['class', 'wrapper'], [['div', ['class', 'inner'], [null]]]);
function ContentWrapper_render(__anchor, __block, { children }) {
var div_24 = root_25();
{
var div_25 = _$_.hydrating ? _$_.hydrate_child() : div_24.firstChild;
{
var expression_6 = _$_.hydrating ? _$_.hydrate_child() : div_25.firstChild;
_$_.expression(expression_6, () => children);
_$_.hydrating && _$_.pop(div_25);
}
}
_$_.append(__anchor, div_24);
}
ContentWrapper[_$_.$r] = ContentWrapper_render;
var root_26 = _$_.template(`<!><p>First paragraph</p><p>Second paragraph</p><!><p>After code`, 1, 5);
function HtmlAfterSwitchInChildren_render(__anchor, __block) {
_$_.render_component(ContentWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_1 = root_26();
var node_9 = _$_.first_child_frag(fragment_1);
_$_.render_component(DynamicHeading, node_9, {
level: 1,
children: _$_.tsrx_element((__anchor, __block) => {
var expression_7 = _$_.text('Title');
_$_.append(__anchor, expression_7);
})
});
var p_1 = _$_.hydrating ? _$_.hydrate_sibling() : node_9.nextSibling;
var p = _$_.hydrating ? _$_.hydrate_sibling() : p_1.nextSibling;
var node_10 = _$_.hydrating ? _$_.hydrate_sibling() : p.nextSibling;
_$_.render_component(CodeBlock, node_10, { code: "const x = 1;" });
_$_.next();
_$_.append(__anchor, fragment_1);
})
});
}
HtmlAfterSwitchInChildren[_$_.$r] = HtmlAfterSwitchInChildren_render;
var root_27 = _$_.template_el('h1', ['class', 'heading'], [null]);
var root_28 = _$_.template_el('h2', ['class', 'heading'], [null]);
function consequent_3(__anchor, { a: primary, b: children }) {
var h1_2 = root_27();
{
var expression_8 = _$_.hydrating ? _$_.hydrate_child() : h1_2.firstChild;
_$_.expression(expression_8, () => children);
_$_.hydrating && _$_.pop(h1_2);
}
_$_.append(__anchor, h1_2);
}
function alternate(__anchor, { a: primary, b: children }) {
var h2_1 = root_28();
{
var expression_9 = _$_.hydrating ? _$_.hydrate_child() : h2_1.firstChild;
_$_.expression(expression_9, () => children);
_$_.hydrating && _$_.pop(h2_1);
}
_$_.append(__anchor, h2_1);
}
function if_4({ a: primary, b: children }) {
if (primary) return consequent_3; else return alternate;
}
function IfHeading_render(__anchor, __block, { primary, children }) {
_$_.if(__anchor, if_4, true, { a: primary, b: children });
}
IfHeading[_$_.$r] = IfHeading_render;
var root_29 = _$_.template(`<!><p>First paragraph</p><p>Second paragraph</p><!><p>After code`, 1, 5);
function HtmlAfterIfInChildren_render(__anchor, __block) {
_$_.render_component(ContentWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_2 = root_29();
var node_11 = _$_.first_child_frag(fragment_2);
_$_.render_component(IfHeading, node_11, {
primary: true,
children: _$_.tsrx_element((__anchor, __block) => {
var expression_10 = _$_.text('Title');
_$_.append(__anchor, expression_10);
})
});
var p_3 = _$_.hydrating ? _$_.hydrate_sibling() : node_11.nextSibling;
var p_2 = _$_.hydrating ? _$_.hydrate_sibling() : p_3.nextSibling;
var node_12 = _$_.hydrating ? _$_.hydrate_sibling() : p_2.nextSibling;
_$_.render_component(CodeBlock, node_12, { code: "const x = 1;" });
_$_.next();
_$_.append(__anchor, fragment_2);
})
});
}
HtmlAfterIfInChildren[_$_.$r] = HtmlAfterIfInChildren_render;
var root_30 = _$_.template_el('span', ['class', 'for-item']);
function ForList_render(__anchor, __block, { items }) {
_$_.for(
__anchor,
() => items,
(__anchor, item) => {
var span = root_30();
{
span.textContent = item;
}
_$_.append(__anchor, span);
},
16
);
}
ForList[_$_.$r] = ForList_render;
var root_31 = _$_.template(`<!><p>First paragraph</p><!><p>After code`, 1, 4);
function HtmlAfterForInChildren_render(__anchor, __block) {
_$_.render_component(ContentWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_3 = root_31();
var node_13 = _$_.first_child_frag(fragment_3);
_$_.render_component(ForList, node_13, { items: ['Title', 'Subtitle'] });
var p_4 = _$_.hydrating ? _$_.hydrate_sibling() : node_13.nextSibling;
var node_14 = _$_.hydrating ? _$_.hydrate_sibling() : p_4.nextSibling;
_$_.render_component(CodeBlock, node_14, { code: "const x = 1;" });
_$_.next();
_$_.append(__anchor, fragment_3);
})
});
}
HtmlAfterForInChildren[_$_.$r] = HtmlAfterForInChildren_render;
var root_32 = _$_.template_el('div', ['class', 'try-box']);
var root_33 = _$_.template_el('span', null, 'error');
function TryBox_render(__anchor, __block, { value }) {
_$_.try(
__anchor,
(__anchor) => {
var div_26 = root_32();
{
div_26.textContent = value;
}
_$_.append(__anchor, div_26);
},
(__anchor, e) => {
var span_1 = root_33();
_$_.append(__anchor, span_1);
},
null,
true
);
}
TryBox[_$_.$r] = TryBox_render;
var root_34 = _$_.template(`<!><p>First paragraph</p><!><p>After code`, 1, 4);
function HtmlAfterTryInChildren_render(__anchor, __block) {
_$_.render_component(ContentWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_4 = root_34();
var node_15 = _$_.first_child_frag(fragment_4);
_$_.render_component(TryBox, node_15, { value: "Title" });
var p_5 = _$_.hydrating ? _$_.hydrate_sibling() : node_15.nextSibling;
var node_16 = _$_.hydrating ? _$_.hydrate_sibling() : p_5.nextSibling;
_$_.render_component(CodeBlock, node_16, { code: "const x = 1;" });
_$_.next();
_$_.append(__anchor, fragment_4);
})
});
}
HtmlAfterTryInChildren[_$_.$r] = HtmlAfterTryInChildren_render;
var root_35 = _$_.template_el('span', ['class', 'boxed'], [null]);
function Boxed_render(__anchor, __block, { children }) {
var span_2 = root_35();
{
var expression_13 = _$_.hydrating ? _$_.hydrate_child() : span_2.firstChild;
_$_.expression(expression_13, () => children);
_$_.hydrating && _$_.pop(span_2);
}
_$_.append(__anchor, span_2);
}
Boxed[_$_.$r] = Boxed_render;
var root_36 = _$_.template(` `, 1, 1);
function IndirectHeading_render(__anchor, __block, { text }) {
_$_.render_component(Boxed, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_5 = root_36();
var expression_14 = _$_.first_child_frag(fragment_5, true);
expression_14.nodeValue = text;
_$_.append(__anchor, fragment_5);
})
});
}
IndirectHeading[_$_.$r] = IndirectHeading_render;
var root_37 = _$_.template(`<!><p>First paragraph</p><!><p>After code`, 1, 4);
function HtmlAfterComponentInChildren_render(__anchor, __block) {
_$_.render_component(ContentWrapper, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_6 = root_37();
var node_17 = _$_.first_child_frag(fragment_6);
_$_.render_component(IndirectHeading, node_17, { text: "Title" });
var p_6 = _$_.hydrating ? _$_.hydrate_sibling() : node_17.nextSibling;
var node_18 = _$_.hydrating ? _$_.hydrate_sibling() : p_6.nextSibling;
_$_.render_component(CodeBlock, node_18, { code: "const x = 1;" });
_$_.next();
_$_.append(__anchor, fragment_6);
})
});
}
HtmlAfterComponentInChildren[_$_.$r] = HtmlAfterComponentInChildren_render;
var root_39 = _$_.template_el('div', ['class', 'indicator']);
function consequent_4(__anchor, active) {
var div_28 = root_39();
_$_.append(__anchor, div_28);
}
function if_5(active) {
if (active) return consequent_4;
}
var root_38 = _$_.template_el('div', null, [['a', null, [['span']]]]);
function NavItem_render(__anchor, __block, { href, text: label, active = false }) {
var div_27 = root_38();
_$_.set_class(div_27, `nav-item${active ? ' active' : ''}`);
{
var node_19 = _$_.hydrating ? _$_.hydrate_child() : div_27.firstChild;
_$_.if(node_19, if_5, false, active);
var a_3 = _$_.hydrating ? _$_.hydrate_sibling() : node_19;
_$_.set_attribute(a_3, 'href', href);
{
var span_3 = _$_.hydrating ? _$_.hydrate_child() : a_3.firstChild;
{
span_3.textContent = label;
}
}
_$_.hydrating && _$_.pop(div_27);
}
_$_.append(__anchor, div_27);
}
NavItem[_$_.$r] = NavItem_render;
var root_41 = _$_.template_el('div', ['class', 'section-items'], [null]);
function consequent_5(__anchor, { a: expanded, b: children }) {
var div_30 = root_41();
{
var expression_17 = _$_.hydrating ? _$_.hydrate_child() : div_30.firstChild;
_$_.expression(expression_17, () => children);
_$_.hydrating && _$_.pop(div_30);
}
_$_.append(__anchor, div_30);
}
function if_6({ a: expanded, b: children }) {
if (expanded.value) return consequent_5;
}
var root_40 = _$_.template_el('section', ['class', 'sidebar-section'], [
[
'div',
['class', 'section-header'],
[['h2'], ['button', null, 'Toggle']]
]
]);
function render_6(__prev) {
var __a = if_6({ a: __prev._a, b: __prev._b });
if (__prev.a !== __a) {
_$_.if_update(__prev._c, __prev.a = __a);
}
}
function SidebarSection_render(__anchor, __block, { title, children }) {
const expanded = _$_.track(true, __block, 'tmjvjj');
var section_1 = root_40();
{
var div_29 = _$_.hydrating ? _$_.hydrate_child() : section_1.firstChild;
{
var h2_2 = _$_.hydrating ? _$_.hydrate_child() : div_29.firstChild;
{
h2_2.textContent = title;
}
var button = _$_.hydrating ? _$_.hydrate_sibling() : h2_2.nextSibling;
button.__click = () => expanded.value = !expanded.value;
}
_$_.hydrating && _$_.pop(div_29);
var node_20 = _$_.hydrating
? _$_.hydrate_sibling()
: _$_.append_into(section_1, true);
var ifs_1 = _$_.if_static(node_20, if_6, 0, { a: expanded, b: children });
_$_.hydrating && _$_.pop(section_1);
}
_$_.render(render_6, { a: _$_.UNINITIALIZED, _a: expanded, _b: children, _c: ifs_1 });
_$_.append(__anchor, section_1);
}
SidebarSection[_$_.$r] = SidebarSection_render;
var root_43 = _$_.template(`<!><!>`, 1, 2);
var root_44 = _$_.template(`<!><!>`, 1, 2);
var root_42 = _$_.template_el('aside', ['class', 'sidebar'], [
[
'nav',
null,
[['div', ['class', 'group']], ['div', ['class', 'group']]]
]
]);
function SideNav_render(__anchor, __block, { currentPath }) {
var aside_1 = root_42();
{
var nav_1 = _$_.hydrating ? _$_.hydrate_child() : aside_1.firstChild;
{
var div_31 = _$_.hydrating ? _$_.hydrate_child() : nav_1.firstChild;
{
var append_anchor = _$_.append_into(div_31);
_$_.render_component(SidebarSection, append_anchor, {
title: "Getting Started",
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_7 = root_43();
var node_21 = _$_.first_child_frag(fragment_7);
_$_.render_component(NavItem, node_21, {
href: "/intro",
text: "Introduction",
active: currentPath === '/intro'
});
var node_22 = _$_.hydrating ? _$_.hydrate_sibling() : node_21.nextSibling;
_$_.render_component(NavItem, node_22, {
href: "/start",
text: "Quick Start",
active: currentPath === '/start'
});
_$_.append(__anchor, fragment_7);
})
});
_$_.hydrating && _$_.pop(div_31);
}
var div_32 = _$_.hydrating ? _$_.hydrate_sibling() : div_31.nextSibling;
{
var append_anchor_1 = _$_.append_into(div_32);
_$_.render_component(SidebarSection, append_anchor_1, {
title: "Guide",
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_8 = root_44();
var node_23 = _$_.first_child_frag(fragment_8);
_$_.render_component(NavItem, node_23, {
href: "/guide/app",
text: "Application",
active: currentPath === '/guide/app'
});
var node_24 = _$_.hydrating ? _$_.hydrate_sibling() : node_23.nextSibling;
_$_.render_component(NavItem, node_24, {
href: "/guide/syntax",
text: "Syntax",
active: currentPath === '/guide/syntax'
});
_$_.append(__anchor, fragment_8);
})
});
_$_.hydrating && _$_.pop(div_32);
}
}
}
_$_.append(__anchor, aside_1);
}
SideNav[_$_.$r] = SideNav_render;
var root_45 = _$_.template_el('header', ['class', 'page-header'], [['div', ['class', 'logo'], 'MyApp']]);
function PageHeader_render(__anchor, __block) {
var header = root_45();
_$_.append(__anchor, header);
}
PageHeader[_$_.$r] = PageHeader_render;
var root_47 = _$_.template_el('div', ['class', 'edit-link'], [['a', ['href', '/edit'], 'Edit']]);
function consequent_6(__anchor) {
var div_36 = root_47();
_$_.append(__anchor, div_36);
}
function if_7() {
if (true) return consequent_6;
}
var root_46 = _$_.template(`<div class=layout><div class=content-wrapper><main class=main-content><div class=article><div><h1>Introduction</h1><p>Welcome to the docs.`);
function LayoutWithSidebarAndMain_render(__anchor, __block) {
var div_33 = root_46();
{
var node_25 = _$_.hydrating ? _$_.hydrate_child() : div_33.firstChild;
_$_.render_component(PageHeader, node_25, {});
var div_34 = _$_.hydrating ? _$_.hydrate_sibling() : node_25;
{
var node_26 = _$_.hydrating ? _$_.hydrate_child() : div_34.firstChild;
_$_.render_component(SideNav, node_26, { currentPath: "/intro" });
var main = _$_.hydrating ? _$_.hydrate_sibling() : node_26;
{
var div_35 = _$_.hydrating ? _$_.hydrate_child() : main.firstChild;
var node_27 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(main);
_$_.if(node_27, if_7);
var node_28 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(main);
_$_.render_component(PageHeader, node_28, {});
_$_.hydrating && _$_.pop(main);
}
_$_.hydrating && _$_.pop(div_34);
}
_$_.hydrating && _$_.pop(div_33);
}
_$_.append(__anchor, div_33);
}
LayoutWithSidebarAndMain[_$_.$r] = LayoutWithSidebarAndMain_render;
var root_48 = _$_.template_el('article', ['class', 'doc-content'], [['div', null, [null]]]);
function ArticleWrapper_render(__anchor, __block, { children }) {
var article_1 = root_48();
{
var div_37 = _$_.hydrating ? _$_.hydrate_child() : article_1.firstChild;
{
var expression_18 = _$_.hydrating ? _$_.hydrate_child() : div_37.firstChild;
_$_.expression(expression_18, () => children);
_$_.hydrating && _$_.pop(div_37);
}
}
_$_.append(__anchor, article_1);
}
ArticleWrapper[_$_.$r] = ArticleWrapper_render;
var root_49 = _$_.template_el('footer', ['class', 'doc-footer'], 'Footer');
function SimpleFooter_render(__anchor, __block) {
var footer_1 = root_49();
_$_.append(__anchor, footer_1);
}
SimpleFooter[_$_.$r] = SimpleFooter_render;
var root_51 = _$_.template(`<h1>Title</h1><p>Content goes here.`, 1, 2);
var root_52 = _$_.template_el('div', ['class', 'edit-link'], [['a', ['href', '/edit'], 'Edit']]);
function consequent_7(__anchor) {
var div_39 = root_52();
_$_.append(__anchor, div_39);
}
function if_8() {
if (true) return consequent_7;
}
var root_53 = _$_.template_el('nav', ['class', 'prev-next'], [['a', ['href', '/prev'], 'Previous']]);
function consequent_8(__anchor) {
var nav_2 = root_53();
_$_.append(__anchor, nav_2);
}
function if_9() {
if (true) return consequent_8;
}
var root_50 = _$_.template_el('div', ['class', 'content-container'], [null, null, null, null]);
function ArticleWithChildrenThenSibling_render(__anchor, __block) {
var div_38 = root_50();
{
var node_29 = _$_.hydrating ? _$_.hydrate_child() : div_38.firstChild;
_$_.render_component(ArticleWrapper, node_29, {
children: _$_.tsrx_element((__anchor, __block) => {
var fragment_9 = root_51();
_$_.next();
_$_.append(__anchor, fragment_9);
})
});
var node_30 = _$_.hydrating ? _$_.hydrate_sibling() : node_29.nextSibling;
_$_.if(node_30, if_8);
var node_31 = _$_.hydrating ? _$_.hydrate_sibling() : node_30.nextSibling;
_$_.if(node_31, if_9);
var node_32 = _$_.hydrating ? _$_.hydrate_sibling() : node_31.nextSibling;
_$_.render_component(SimpleFooter, node_32, {});
_$_.hydrating && _$_.pop(div_38);
}
_$_.append(__anchor, div_38);
}
ArticleWithChildrenThenSibling[_$_.$r] = ArticleWithChildrenThenSibling_render;
var root_55 = _$_.template_el('div', ['class', 'doc-content']);
var root_56 = _$_.template_el('div', ['class', 'edit-link'], [['a', ['href', '/edit'], 'Edit']]);
function consequent_9(__anchor) {
var div_42 = root_56();
_$_.append(__anchor, div_42);
}
function if_10() {
if (true) return consequent_9;
}
var root_54 = _$_.template_el('div', ['class', 'content-container'], [null, null, null]);
function ArticleWithHtmlChildThenSibling_render(__anchor, __block) {
const htmlContent = '<pre><code>const x = 1;</code></pre>';
var div_40 = root_54();
{
var node_33 = _$_.hydrating ? _$_.hydrate_child() : div_40.firstChild;
_$_.render_component(ArticleWrapper, node_33, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_41 = root_55();
div_41.innerHTML = htmlContent ?? div_41.innerHTML;
_$_.append(__anchor, div_41);
})
});
var node_34 = _$_.hydrating ? _$_.hydrate_sibling() : node_33.nextSibling;
_$_.if(node_34, if_10);
var node_35 = _$_.hydrating ? _$_.hydrate_sibling() : node_34.nextSibling;
_$_.render_component(SimpleFooter, node_35, {});
_$_.hydrating && _$_.pop(div_40);
}
_$_.append(__anchor, div_40);
}
ArticleWithHtmlChildThenSibling[_$_.$r] = ArticleWithHtmlChildThenSibling_render;
var root_58 = _$_.template_el('div', ['class', 'edit-link'], [['a', ['href', '/edit'], 'Edit']]);
function consequent_10(__anchor) {
var div_45 = root_58();
_$_.append(__anchor, div_45);
}
function if_11() {
if (true) return consequent_10;
}
var root_57 = _$_.template_el('div', ['class', 'content-container'], [
['article', ['class', 'doc-content'], [['div', null, [null]]]]
]);
function InlineArticleLayout_render(__anchor, __block, { children }) {
var div_43 = root_57();
{
var article_2 = _$_.hydrating ? _$_.hydrate_child() : div_43.firstChild;
{
var div_44 = _$_.hydrating ? _$_.hydrate_child() : article_2.firstChild;
{
var expression_19 = _$_.hydrating ? _$_.hydrate_child() : div_44.firstChild;
_$_.expression(expression_19, () => children);
_$_.hydrating && _$_.pop(div_44);
}
}
_$_.hydrating && _$_.pop(article_2);
var node_36 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_43);
_$_.if(node_36, if_11);
var node_37 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_43);
_$_.render_component(SimpleFooter, node_37, {});
_$_.hydrating && _$_.pop(div_43);
}
_$_.append(__anchor, div_43);
}
InlineArticleLayout[_$_.$r] = InlineArticleLayout_render;
var root_59 = _$_.template_el('div', ['class', 'doc-content']);
function InlineArticleWithHtmlChild_render(__anchor, __block) {
const htmlContent = '<pre><code>const x = 1;</code></pre>';
_$_.render_component(InlineArticleLayout, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_46 = root_59();
div_46.innerHTML = htmlContent ?? div_46.innerHTML;
_$_.append(__anchor, div_46);
})
});
}
InlineArticleWithHtmlChild[_$_.$r] = InlineArticleWithHtmlChild_render;
var root_60 = _$_.template_el('header', ['class', 'header'], 'Header');
function HeaderStub_render(__anchor, __block) {
var header_1 = root_60();
_$_.append(__anchor, header_1);
}
HeaderStub[_$_.$r] = HeaderStub_render;
var root_61 = _$_.template_el('aside', ['class', 'sidebar'], 'Sidebar');
function SidebarStub_render(__anchor, __block) {
var aside_2 = root_61();
_$_.append(__anchor, aside_2);
}
SidebarStub[_$_.$r] = SidebarStub_render;
var root_62 = _$_.template_el('footer', ['class', 'footer'], 'Footer');
function FooterStub_render(__anchor, __block) {
var footer_2 = root_62();
_$_.append(__anchor, footer_2);
}
FooterStub[_$_.$r] = FooterStub_render;
var root_64 = _$_.template_el('div', ['class', 'edit-link'], [['a', ['href', '/edit'], 'Edit on GitHub']]);
function consequent_11(__anchor, editPath) {
var div_53 = root_64();
_$_.append(__anchor, div_53);
}
function if_12(editPath) {
if (editPath) return consequent_11;
}
var root_65 = _$_.template_el('nav', ['class', 'prev-next'], [['a', null, ' ']]);
function render_7(__prev) {
var __a = __prev._a.href;
if (__prev.a !== __a) {
_$_.set_attribute(__prev._b, 'href', __prev.a = __a);
}
}
function consequent_12(__anchor, nextLink) {
var nav_3 = root_65();
{
var a_4 = _$_.hydrating ? _$_.hydrate_child() : nav_3.firstChild;
{
var expression_21 = _$_.hydrating ? _$_.hydrate_child() : a_4.firstChild;
_$_.expression(expression_21, () => nextLink.text);
_$_.hydrating && _$_.pop(a_4);
}
}
_$_.render(render_7, { a: void 0, _a: nextLink, _b: a_4 });
_$_.append(__anchor, nav_3);
}
function if_13(nextLink) {
if (nextLink) return consequent_12;
}
var root_63 = _$_.template(`<div class=layout><div class=docs-wrapper><main class=docs-main><div class=docs-container><div class=content><div class=content-container><article class=doc-content><div><!>`);
function DocsLayoutInner_render(
__anchor,
__block,
{ children, editPath = '', nextLink = null }
) {
var div_47 = root_63();
{
var node_38 = _$_.hydrating ? _$_.hydrate_child() : div_47.firstChild;
_$_.render_component(HeaderStub, node_38, {});
var div_48 = _$_.hydrating ? _$_.hydrate_sibling() : node_38;
{
var node_39 = _$_.hydrating ? _$_.hydrate_child() : div_48.firstChild;
_$_.render_component(SidebarStub, node_39, {});
var main_1 = _$_.hydrating ? _$_.hydrate_sibling() : node_39;
{
var div_51 = _$_.hydrating ? _$_.hydrate_child() : main_1.firstChild;
{
var div_50 = _$_.hydrating ? _$_.hydrate_child() : div_51.firstChild;
{
var div_49 = _$_.hydrating ? _$_.hydrate_child() : div_50.firstChild;
{
var article_3 = _$_.hydrating ? _$_.hydrate_child() : div_49.firstChild;
{
var div_52 = _$_.hydrating ? _$_.hydrate_child() : article_3.firstChild;
{
var expression_20 = _$_.hydrating ? _$_.hydrate_child() : div_52.firstChild;
_$_.expression(expression_20, () => children);
_$_.hydrating && _$_.pop(div_52);
}
}
_$_.hydrating && _$_.pop(article_3);
var node_40 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_49);
_$_.if(node_40, if_12, false, editPath);
var node_41 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_49);
_$_.if(node_41, if_13, false, nextLink);
var node_42 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_49);
_$_.render_component(FooterStub, node_42, {});
_$_.hydrating && _$_.pop(div_49);
}
}
}
}
_$_.hydrating && _$_.pop(div_48);
}
_$_.hydrating && _$_.pop(div_47);
}
_$_.append(__anchor, div_47);
}
DocsLayoutInner[_$_.$r] = DocsLayoutInner_render;
var root_66 = _$_.template_el('div', ['class', 'doc-content']);
function DocsLayoutWithData_render(__anchor, __block) {
const htmlContent = '<h1>Title</h1><p>Content</p>';
_$_.render_component(DocsLayoutInner, __anchor, {
editPath: "docs/styling.md",
nextLink: { href: '/next', text: 'Next' },
children: _$_.tsrx_element((__anchor, __block) => {
var div_54 = root_66();
div_54.innerHTML = htmlContent ?? div_54.innerHTML;
_$_.append(__anchor, div_54);
})
});
}
DocsLayoutWithData[_$_.$r] = DocsLayoutWithData_render;
var root_67 = _$_.template_el('div', ['class', 'doc-content']);
function DocsLayoutWithoutData_render(__anchor, __block) {
const htmlContent = undefined;
_$_.render_component(DocsLayoutInner, __anchor, {
children: _$_.tsrx_element((__anchor, __block) => {
var div_55 = root_67();
div_55.innerHTML = htmlContent ?? div_55.innerHTML;
_$_.append(__anchor, div_55);
})
});
}
DocsLayoutWithoutData[_$_.$r] = DocsLayoutWithoutData_render;
var root_69 = _$_.template_el('div', ['class', 'edit-link'], [['a', null, 'Edit on GitHub']]);
function consequent_13(__anchor, editPath) {
var div_62 = root_69();
{
var a_5 = _$_.hydrating ? _$_.hydrate_child() : div_62.firstChild;
a_5.setAttribute('href', `/edit/${editPath}`);
}
_$_.append(__anchor, div_62);
}
function if_14(editPath) {
if (editPath) return consequent_13;
}
var root_71 = _$_.template_el('a', ['class', 'pager prev'], [['span', ['class', 'title'], ' ']]);
function render_8(__prev) {
var __a = __prev._a.href;
if (__prev.a !== __a) {
_$_.set_attribute(__prev._b, 'href', __prev.a = __a);
}
}
var root_72 = _$_.template_el('span');
function consequent_14(__anchor, prevLink) {
var a_6 = root_71();
{
var span_4 = _$_.hydrating ? _$_.hydrate_child() : a_6.firstChild;
{
var expression_23 = _$_.hydrating ? _$_.hydrate_child() : span_4.firstChild;
_$_.expression(expression_23, () => prevLink.text);
_$_.hydrating && _$_.pop(span_4);
}
}
_$_.render(render_8, { a: void 0, _a: prevLink, _b: a_6 });
_$_.append(__anchor, a_6);
}
function alternate_1(__anchor, prevLink) {
var span_5 = root_72();
_$_.append(__anchor, span_5);
}
function if_15(prevLink) {
if (prevLink) return consequent_14; else return alternate_1;
}
var root_73 = _$_.template_el('a', ['class', 'pager next'], [['span', ['class', 'title'], ' ']]);
function render_9(__prev) {
var __a = __prev._a.href;
if (__prev.a !== __a) {
_$_.set_attribute(__prev._b, 'href', __prev.a = __a);
}
}
function consequent_15(__anchor, nextLink) {
var a_7 = root_73();
{
var span_6 = _$_.hydrating ? _$_.hydrate_child() : a_7.firstChild;
{
var expression_24 = _$_.hydrating ? _$_.hydrate_child() : span_6.firstChild;
_$_.expression(expression_24, () => nextLink.text);
_$_.hydrating && _$_.pop(span_6);
}
}
_$_.render(render_9, { a: void 0, _a: nextLink, _b: a_7 });
_$_.append(__anchor, a_7);
}
function if_16(nextLink) {
if (nextLink) return consequent_15;
}
var root_70 = _$_.template_el('nav', ['class', 'prev-next'], [null, null]);
function consequent_16(__anchor, { a: prevLink, b: nextLink }) {
var nav_4 = root_70();
{
var node_47 = _$_.hydrating ? _$_.hydrate_child() : nav_4.firstChild;
_$_.if(node_47, if_15, false, prevLink);
var node_48 = _$_.hydrating ? _$_.hydrate_sibling() : node_47.nextSibling;
_$_.if(node_48, if_16, false, nextLink);
_$_.hydrating && _$_.pop(nav_4);
}
_$_.append(__anchor, nav_4);
}
function if_17({ a: prevLink, b: nextLink }) {
if (prevLink || nextLink) return consequent_16;
}
var root_75 = _$_.template_el('a');
function render_10(__prev) {
var __a = __prev._a.text;
if (__prev.a !== __a) {
_$_.set_text_content(__prev._b, __a, __prev.a);
__prev.a = __a;
}
var __b = __prev._a.href;
if (__prev.b !== __b) {
_$_.set_attribute(__prev._b, 'href', __prev.b = __b);
}
}
var root_74 = _$_.template_el('div', ['class', 'aside-content'], [['nav', ['class', 'outline']]]);
function consequent_17(__anchor, toc) {
var div_63 = root_74();
{
var nav_5 = _$_.hydrating ? _$_.hydrate_child() : div_63.firstChild;
{
_$_.for(
nav_5,
() => toc,
(__anchor, item) => {
var a_8 = root_75();
_$_.item({ a: '', b: void 0, _a: item, _b: a_8 });
_$_.append(__anchor, a_8);
},
4,
void 0,
render_10
);
_$_.hydrating && _$_.pop(nav_5);
}
}
_$_.append(__anchor, div_63);
}
function if_18(toc) {
if (toc.length > 0) return consequent_17;
}
var root_68 = _$_.template(`<div class=layout><div class=docs-wrapper><main class=docs-main><div class=docs-container><div class=content><div class=content-container><article class=doc-content><div><!></div></article></div></div><aside class=aside><!>`);
function render_11(__prev) {
var __a = if_18(__prev._a);
if (__prev.a !== __a) {
_$_.if_update(__prev._b, __prev.a = __a);
}
}
function DocsLayoutExact_render(
__anchor,
__block,
{
children,
editPath = '',
prevLink = null,
nextLink = null,
toc = []
}
) {
var div_56 = root_68();
{
var node_43 = _$_.hydrating ? _$_.hydrate_child() : div_56.firstChild;
_$_.render_component(HeaderStub, node_43, {});
var div_57 = _$_.hydrating ? _$_.hydrate_sibling() : node_43;
{
var node_44 = _$_.hydrating ? _$_.hydrate_child() : div_57.firstChild;
_$_.render_component(SidebarStub, node_44, {});
var main_2 = _$_.hydrating ? _$_.hydrate_sibling() : node_44;
{
var div_60 = _$_.hydrating ? _$_.hydrate_child() : main_2.firstChild;
{
var div_59 = _$_.hydrating ? _$_.hydrate_child() : div_60.firstChild;
{
var div_58 = _$_.hydrating ? _$_.hydrate_child() : div_59.firstChild;
{
var article_4 = _$_.hydrating ? _$_.hydrate_child() : div_58.firstChild;
{
var div_61 = _$_.hydrating ? _$_.hydrate_child() : article_4.firstChild;
{
var expression_22 = _$_.hydrating ? _$_.hydrate_child() : div_61.firstChild;
_$_.expression(expression_22, () => children);
_$_.hydrating && _$_.pop(div_61);
}
}
_$_.hydrating && _$_.pop(article_4);
var node_45 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_58);
_$_.if(node_45, if_14, false, editPath);
var node_46 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_58);
_$_.if(node_46, if_17, false, { a: prevLink, b: nextLink });
var node_49 = _$_.hydrating ? _$_.hydrate_sibling() : _$_.append_into(div_58);
_$_.render_component(FooterStub, node_49, {});
_$_.hydrating && _$_.pop(div_58);
}
}
_$_.hydrating && _$_.pop(div_59);
var aside_3 = _$_.hydrating ? _$_.hydrate_sibling() : div_59.nextSibling;
{
var node_50 = _$_.hydrating ? _$_.hydrate_child() : aside_3.firstChild;
var ifs_2 = _$_.if_static(node_50, if_18, 0, toc);
_$_.hydrating && _$_.pop(aside_3);
}
}
}
_$_.hydrating && _$_.pop(div_57);
}
_$_.hydrating && _$_.pop(div_56);
}
_$_.render(render_11, { a: _$_.UNINITIALIZED, _a: toc, _b: ifs_2 });
_$_.append(__anchor, div_56);
}
DocsLayoutExact[_$_.$r] = DocsLayoutExact_render;
var root_76 = _$_.template_el('div', ['class', 'doc-content']);
function DocsLayoutExactWithData_render(__anchor, __block) {
const htmlContent = '<h1>Styling Guide</h1><p>Content</p>';
_$_.render_component(DocsLayoutExact, __anchor, {
editPath: "docs/guide/styling.md",
prevLink: { href: '/prev', text: 'Previous' },
nextLink: { href: '/next', text: 'Next' },
toc: [
{ href: '#intro', text: 'Introduction' },
{ href: '#usage', text: 'Usage' }
],
children: _$_.tsrx_element((__anchor, __block) => {
var div_64 = root_76();
div_64.innerHTML = htmlContent ?? div_64.innerHTML;
_$_.append(__anchor, div_64);
})
});
}
DocsLayoutExactWithData[_$_.$r] = DocsLayoutExactWithData_render;
var root_77 = _$_.template_el('div', ['class', 'doc-content']);
function DocsLayoutExactWithoutData_render(__anchor, __block) {
const htmlContent = undefined;
const editPath = undefined;
const prevLink = undefined;
const nextLink = undefined;
const toc = undefined;
_$_.render_component(DocsLayoutExact, __anchor, {
editPath,
prevLink,
nextLink,
toc,
children: _$_.tsrx_element((__anchor, __block) => {
var div_65 = root_77();
div_65.innerHTML = htmlContent ?? div_65.innerHTML;
_$_.append(__anchor, div_65);
})
});
}
DocsLayoutExactWithoutData[_$_.$r] = DocsLayoutExactWithoutData_render;
var root_78 = _$_.template(`<div><template id=t1></template><p class=content>Main content`);
function render_12(__prev) {
var __a = _$_.with_scope(__prev._a, () => JSON.stringify(__prev._b));
if (__prev.a !== __a) {
__prev._c.innerHTML = (__prev.a = __a) ?? __prev._c.innerHTML;
}
}
function TemplateWithHtmlContent_render(__anchor, __block) {
const data = { title: 'Test', value: 42 };
var div_66 = root_78();
{
var template = _$_.hydrating ? _$_.hydrate_child() : div_66.firstChild;
}
_$_.render(render_12, { a: template.innerHTML, _a: __block, _b: data, _c: template });
_$_.append(__anchor, div_66);
}
TemplateWithHtmlContent[_$_.$r] = TemplateWithHtmlContent_render;
var root_79 = _$_.template(`<div class=wrapper><h1>Title</h1><template id=data-template></template><p class=after-template>Content after template`);
function render_13(__prev) {
var __a = _$_.with_scope(__prev._a, () => JSON.stringify(__prev._b));
if (__prev.a !== __a) {
__prev._c.innerHTML = (__prev.a = __a) ?? __prev._c.innerHTML;
}
}
function TemplateWithHtmlAndSiblings_render(__anchor, __block) {
const data = { name: 'Ripple', version: '1.0' };
var div_67 = root_79();
{
var h1_3 = _$_.hydrating ? _$_.hydrate_child() : div_67.firstChild;
var template_1 = _$_.hydrating ? _$_.hydrate_sibling() : h1_3.nextSibling;
}
_$_.render(render_13, {
a: template_1.innerHTML,
_a: __block,
_b: data,
_c: template_1
});
_$_.append(__anchor, div_67);
}
TemplateWithHtmlAndSiblings[_$_.$r] = TemplateWithHtmlAndSiblings_render;
var root_80 = _$_.template(`<div class=layout><template id=page-data></template><main><!>`);
function render_14(__prev) {
var __a = _$_.with_scope(__prev._a, () => JSON.stringify(__prev._b));
if (__prev.a !== __a) {
__prev._c.innerHTML = (__prev.a = __a) ?? __prev._c.innerHTML;
}
}
function LayoutWithTemplate_render(__anchor, __block, { children, data }) {
var div_68 = root_80();
{
var template_2 = _$_.hydrating ? _$_.hydrate_child() : div_68.firstChild;
var main_3 = _$_.hydrating ? _$_.hydrate_sibling() : template_2.nextSibling;
{
var expression_26 = _$_.hydrating ? _$_.hydrate_child() : main_3.firstChild;
_$_.expression(expression_26, () => children);
_$_.hydrating && _$_.pop(main_3);
}
}
_$_.render(render_14, {
a: template_2.innerHTML,
_a: __block,
_b: data,
_c: template_2
});
_$_.append(__anchor, div_68);
}
LayoutWithTemplate[_$_.$r] = LayoutWithTemplate_render;
var root_81 = _$_.template_el('div', ['class', 'doc-content']);
function render_15(__prev) {
var __a = __prev._a.html;
if (__prev.a !== __a) {
__prev._b.innerHTML = (__prev.a = __a) ?? __prev._b.innerHTML;
}
}
function NestedTemplateInLayout_render(__anchor, __block) {
const doc = { title: 'Comparison', html: '<p>Content</p>' };
_$_.render_component(LayoutWithTemplate, __anchor, {
data: doc,
children: _$_.tsrx_element((__anchor, __block) => {
var div_69 = root_81();
_$_.render(render_15, { a: div_69.innerHTML, _a: doc, _b: div_69 });
_$_.append(__anchor, div_69);
})
});
}
NestedTemplateInLayout[_$_.$r] = NestedTemplateInLayout_render;
var root_82 = _$_.template(`<section class=readable-section><p>Ergonomics</p><h2>Sibling traversal pattern</h2><p>Before first block</p><p>Before second block</p><pre class=code-block><code></code></pre><p>Between one and two</p><pre class=code-block><code></code></pre><p>Between two and three</p><pre class=code-block><code>`);
function HtmlCodeBlocksWithSiblingChain_render(__anchor, __block) {
const html1 = '<span class="kw">const</span> <span class="id">a</span> = 1;';
const html2 = '<span class="kw">const</span> <span class="id">b</span> = 2;';
const html3 = '<span class="kw">const</span> <span class="id">c</span> = 3;';
var section_2 = root_82();
{
var p_9 = _$_.hydrating ? _$_.hydrate_child() : section_2.firstChild;
var h2_3 = _$_.hydrating ? _$_.hydrate_sibling() : p_9.nextSibling;
var p_8 = _$_.hydrating ? _$_.hydrate_sibling() : h2_3.nextSibling;
var p_7 = _$_.hydrating ? _$_.hydrate_sibling() : p_8.nextSibling;
var pre = _$_.hydrating ? _$_.hydrate_sibling() : p_7.nextSibling;
{
var code_1 = _$_.hydrating ? _$_.hydrate_child() : pre.firstChild;
code_1.innerHTML = html1 ?? code_1.innerHTML;
}
_$_.hydrating && _$_.pop(pre);
var p_10 = _$_.hydrating ? _$_.hydrate_sibling() : pre.nextSibling;
var pre_1 = _$_.hydrating ? _$_.hydrate_sibling() : p_10.nextSibling;
{
var code_2 = _$_.hydrating ? _$_.hydrate_child() : pre_1.firstChild;
code_2.innerHTML = html2 ?? code_2.innerHTML;
}
_$_.hydrating && _$_.pop(pre_1);
var p_11 = _$_.hydrating ? _$_.hydrate_sibling() : pre_1.nextSibling;
var pre_2 = _$_.hydrating ? _$_.hydrate_sibling() : p_11.nextSibling;
{
var code_3 = _$_.hydrating ? _$_.hydrate_child() : pre_2.firstChild;
code_3.innerHTML = html3 ?? code_3.innerHTML;
}
}
_$_.append(__anchor, section_2);
}
HtmlCodeBlocksWithSiblingChain[_$_.$r] = HtmlCodeBlocksWithSiblingChain_render;
import { Fragment, track } from 'ripple';
export function StaticHtml() {
return _$_.tsrx_element(StaticHtml_render);
}
export function DynamicHtml() {
return _$_.tsrx_element(DynamicHtml_render);
}
export function EmptyHtml() {
return _$_.tsrx_element(EmptyHtml_render);
}
export function ComplexHtml() {
return _$_.tsrx_element(ComplexHtml_render);
}
export function MultipleHtml() {
return _$_.tsrx_element(MultipleHtml_render);
}
export function HtmlWithReactivity() {
return _$_.tsrx_element(HtmlWithReactivity_render);
}
export function HtmlWrapper(__props) {
return _$_.tsrx_element(HtmlWrapper_render, __props);
}
export function HtmlInChildren() {
return _$_.tsrx_element(HtmlInChildren_render);
}
export function HtmlInChildrenWithSiblings() {
return _$_.tsrx_element(HtmlInChildrenWithSiblings_render);
}
export function MultipleHtmlInChildren() {
return _$_.tsrx_element(MultipleHtmlInChildren_render);
}
export function HtmlWithComments() {
return _$_.tsrx_element(HtmlWithComments_render);
}
export function HtmlWithEmptyComment() {
return _$_.tsrx_element(HtmlWithEmptyComment_render);
}
export function HtmlWithCommentsInChildren() {
return _$_.tsrx_element(HtmlWithCommentsInChildren_render);
}
function DocFooter() {
return _$_.tsrx_element(DocFooter_render);
}
export function DocLayout(__props) {
return _$_.tsrx_element(DocLayout_render, __props);
}
export function HtmlWithServerData() {
return _$_.tsrx_element(HtmlWithServerData_render);
}
export function HtmlWithClientDefaults() {
return _$_.tsrx_element(HtmlWithClientDefaults_render);
}
export function HtmlWithUndefinedContent() {
return _$_.tsrx_element(HtmlWithUndefinedContent_render);
}
function DynamicHeading(__props) {
return _$_.tsrx_element(DynamicHeading_render, __props);
}
function CodeBlock(__props) {
return _$_.tsrx_element(CodeBlock_render, __props);
}
function ContentWrapper(__props) {
return _$_.tsrx_element(ContentWrapper_render, __props);
}
export function HtmlAfterSwitchInChildren() {
return _$_.tsrx_element(HtmlAfterSwitchInChildren_render);
}
function IfHeading(__props) {
return _$_.tsrx_element(IfHeading_render, __props);
}
export function HtmlAfterIfInChildren() {
return _$_.tsrx_element(HtmlAfterIfInChildren_render);
}
function ForList(__props) {
return _$_.tsrx_element(ForList_render, __props);
}
export function HtmlAfterForInChildren() {
return _$_.tsrx_element(HtmlAfterForInChildren_render);
}
function TryBox(__props) {
return _$_.tsrx_element(TryBox_render, __props);
}
export function HtmlAfterTryInChildren() {
return _$_.tsrx_element(HtmlAfterTryInChildren_render);
}
function Boxed(__props) {
return _$_.tsrx_element(Boxed_render, __props);
}
function IndirectHeading(__props) {
return _$_.tsrx_element(IndirectHeading_render, __props);
}
export function HtmlAfterComponentInChildren() {
return _$_.tsrx_element(HtmlAfterComponentInChildren_render);
}
function NavItem(__props) {
return _$_.tsrx_element(NavItem_render, __props);
}
function SidebarSection(__props) {
return _$_.tsrx_element(SidebarSection_render, __props);
}
function SideNav(__props) {
return _$_.tsrx_element(SideNav_render, __props);
}
function PageHeader() {
return _$_.tsrx_element(PageHeader_render);
}
export function LayoutWithSidebarAndMain() {
return _$_.tsrx_element(LayoutWithSidebarAndMain_render);
}
function ArticleWrapper(__props) {
return _$_.tsrx_element(ArticleWrapper_render, __props);
}
function SimpleFooter() {
return _$_.tsrx_element(SimpleFooter_render);
}
export function ArticleWithChildrenThenSibling() {
return _$_.tsrx_element(ArticleWithChildrenThenSibling_render);
}
export function ArticleWithHtmlChildThenSibling() {
return _$_.tsrx_element(ArticleWithHtmlChildThenSibling_render);
}
function InlineArticleLayout(__props) {
return _$_.tsrx_element(InlineArticleLayout_render, __props);
}
export function InlineArticleWithHtmlChild() {
return _$_.tsrx_element(InlineArticleWithHtmlChild_render);
}
function HeaderStub() {
return _$_.tsrx_element(HeaderStub_render);
}
function SidebarStub() {
return _$_.tsrx_element(SidebarStub_render);
}
function FooterStub() {
return _$_.tsrx_element(FooterStub_render);
}
function DocsLayoutInner(__props) {
return _$_.tsrx_element(DocsLayoutInner_render, __props);
}
export function DocsLayoutWithData() {
return _$_.tsrx_element(DocsLayoutWithData_render);
}
export function DocsLayoutWithoutData() {
return _$_.tsrx_element(DocsLayoutWithoutData_render);
}
function DocsLayoutExact(__props) {
return _$_.tsrx_element(DocsLayoutExact_render, __props);
}
export function DocsLayoutExactWithData() {
return _$_.tsrx_element(DocsLayoutExactWithData_render);
}
export function DocsLayoutExactWithoutData() {
return _$_.tsrx_element(DocsLayoutExactWithoutData_render);
}
export function TemplateWithHtmlContent() {
return _$_.tsrx_element(TemplateWithHtmlContent_render);
}
export function TemplateWithHtmlAndSiblings() {
return _$_.tsrx_element(TemplateWithHtmlAndSiblings_render);
}
function LayoutWithTemplate(__props) {
return _$_.tsrx_element(LayoutWithTemplate_render, __props);
}
export function NestedTemplateInLayout() {
return _$_.tsrx_element(NestedTemplateInLayout_render);
}
export function HtmlCodeBlocksWithSiblingChain() {
return _$_.tsrx_element(HtmlCodeBlocksWithSiblingChain_render);
}
_$_.delegate(['click']);