npm - @barefootjs/jsx - Versions diffs - 0.30.6 → 0.31.0 - Mend

@barefootjs/jsx 0.30.6 → 0.31.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (37) hide show

package/dist/adapters/interface.d.ts +61 -20
package/dist/adapters/interface.d.ts.map +1 -1
package/dist/analyzer.d.ts +1 -1
package/dist/analyzer.d.ts.map +1 -1
package/dist/compiler.d.ts.map +1 -1
package/dist/index.d.ts +0 -120
package/dist/index.d.ts.map +1 -1
package/dist/index.js +322 -263
package/dist/ir-to-client-js/emit-registration.d.ts.map +1 -1
package/dist/ir-to-client-js/generate-init.d.ts.map +1 -1
package/dist/ir-to-client-js/prune-unused-prop-extractions.d.ts +7 -0
package/dist/ir-to-client-js/prune-unused-prop-extractions.d.ts.map +1 -0
package/dist/types.d.ts +25 -0
package/dist/types.d.ts.map +1 -1
package/dist/value-references.d.ts +7 -7
package/dist/value-references.d.ts.map +1 -1
package/package.json +3 -7
package/src/__tests__/__snapshots__/doc-examples.test.ts.snap +183 -312
package/src/__tests__/bf050-single-multi-symmetry.test.ts +118 -0
package/src/__tests__/client-js-generation.test.ts +5 -1
package/src/__tests__/doc-examples.test.ts +5 -1
package/src/__tests__/prune-unused-prop-extractions.test.ts +78 -0
package/src/adapters/interface.ts +61 -20
package/src/analyzer.ts +16 -5
package/src/compiler.ts +41 -3
package/src/index.ts +0 -123
package/src/ir-to-client-js/emit-registration.ts +9 -0
package/src/ir-to-client-js/generate-init.ts +4 -1
package/src/ir-to-client-js/index.ts +5 -1
package/src/ir-to-client-js/prune-unused-prop-extractions.ts +108 -0
package/src/types.ts +25 -0
package/src/value-references.ts +7 -7
package/dist/import-map.d.ts +0 -56
package/dist/import-map.d.ts.map +0 -1
package/dist/import-map.js +0 -18
package/src/__tests__/import-map.test.ts +0 -75
package/src/import-map.ts +0 -72

package/src/__tests__/__snapshots__/doc-examples.test.ts.snap CHANGED Viewed

@@ -15,7 +15,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -29,17 +29,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -85,7 +83,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -99,17 +97,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -157,7 +153,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -171,17 +167,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -218,7 +212,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -232,17 +226,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -279,7 +271,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -293,17 +285,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -350,7 +340,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -364,17 +354,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -418,7 +406,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -432,17 +420,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -492,7 +478,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -506,17 +492,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -553,7 +537,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -567,17 +551,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -614,7 +596,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -628,17 +610,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -675,7 +655,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -689,17 +669,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -736,7 +714,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -750,17 +728,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -796,7 +772,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -810,17 +786,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -856,7 +830,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -870,17 +844,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -916,7 +888,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -930,17 +902,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -976,7 +946,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -990,17 +960,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1036,7 +1004,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1050,17 +1018,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1096,7 +1062,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1110,17 +1076,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1156,7 +1120,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1170,17 +1134,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1216,7 +1178,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1230,17 +1192,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1277,7 +1237,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1291,17 +1251,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1338,7 +1296,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1352,17 +1310,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1408,7 +1364,7 @@ export function initSortedList(__scope, _p = {}) {
 }
-hydrate('SortedList__b3c36eee', { init: initSortedList, template: (_p) => \`<ul bf="s1"><!--bf-loop:l0-->\${_p.items.sort(byPrice).map((item) => \`<li data-key="\${escapeAttr(item.id)}"><!--bf:s0-->\${escapeText(item.name)}<!--/--></li>\`).join('')}<!--bf-/loop:l0--></ul>\` })
+hydrate('SortedList__b3c36eee', { init: initSortedList, template: (_p) => \`<ul bf="s1"><!--bf-loop:l0-->\${_p.items.sort(byPrice).map((item) => \`<li data-key="\${escapeAttr(item.id)}"><!--bf:s0-->\${escapeText(item.name)}<!--/--></li>\`).join('')}<!--bf-/loop:l0--></ul>\`, name: 'SortedList' })
 export function SortedList(_p, __bfKey) { return createComponent('SortedList__b3c36eee', _p, __bfKey) }"
 `;
@@ -1427,7 +1383,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1441,17 +1397,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1488,7 +1442,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1502,17 +1456,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1548,7 +1500,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1562,17 +1514,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1608,7 +1558,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1622,17 +1572,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1668,7 +1616,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1682,17 +1630,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -1722,7 +1668,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -1736,17 +1682,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -2121,7 +2065,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -2135,17 +2079,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -2251,7 +2193,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -2265,17 +2207,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -2553,7 +2493,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -2567,17 +2507,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -2629,7 +2567,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -2643,11 +2581,11 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
@@ -2812,7 +2750,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -2826,17 +2764,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -2890,7 +2826,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -2904,17 +2840,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -2949,7 +2883,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -2963,17 +2897,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3007,7 +2939,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3021,17 +2953,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3067,7 +2997,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3081,17 +3011,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3127,7 +3055,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3141,17 +3069,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3196,7 +3122,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3210,17 +3136,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3272,7 +3196,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3286,17 +3210,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3342,7 +3264,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3356,17 +3278,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3453,7 +3373,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3467,17 +3387,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3603,7 +3521,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3617,17 +3535,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3666,7 +3582,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3680,17 +3596,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -3846,7 +3760,7 @@ export function initDialogOverlay(__scope, _p = {}) {
   if (_s0) (handleMount)(_s0)
 }
-hydrate('DialogOverlay__b3c36eee', { init: initDialogOverlay, template: (_p) => \`<div data-slot="dialog-overlay" bf="s0"></div>\` })
+hydrate('DialogOverlay__b3c36eee', { init: initDialogOverlay, template: (_p) => \`<div data-slot="dialog-overlay" bf="s0"></div>\`, name: 'DialogOverlay' })
 export function DialogOverlay(_p, __bfKey) { return createComponent('DialogOverlay__b3c36eee', _p, __bfKey) }"
 `;
@@ -3917,7 +3831,7 @@ exports[`docs/core/components/props-type-safety.md doc-examples L54 — (no labe
 function initButton() {}
-hydrate('Button__b3c36eee', { init: initButton, template: (_p) => \`<button \${((\`btn btn-\${(_p.variant ?? 'default')} btn-\${(_p.size ?? 'md')} \${_p.className ?? ''}\`)) != null ? 'class="' + escapeAttr((\`btn btn-\${(_p.variant ?? 'default')} btn-\${(_p.size ?? 'md')} \${_p.className ?? ''}\`)) + '"' : ''} bf="s0">\${_p.children}</button>\` })
+hydrate('Button__b3c36eee', { init: initButton, template: (_p) => \`<button \${((\`btn btn-\${(_p.variant ?? 'default')} btn-\${(_p.size ?? 'md')} \${_p.className ?? ''}\`)) != null ? 'class="' + escapeAttr((\`btn btn-\${(_p.variant ?? 'default')} btn-\${(_p.size ?? 'md')} \${_p.className ?? ''}\`)) + '"' : ''} bf="s0">\${_p.children}</button>\`, name: 'Button' })
 export function Button(_p, __bfKey) { return createComponent('Button__b3c36eee', _p, __bfKey) }"
 `;
@@ -3946,7 +3860,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -3960,17 +3874,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4168,8 +4080,6 @@ export function initLayout(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [_s0] = $c(__scope, 's0')
@@ -4196,7 +4106,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4210,17 +4120,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4262,7 +4170,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4276,17 +4184,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4328,7 +4234,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4342,17 +4248,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4394,7 +4298,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4408,17 +4312,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4526,7 +4428,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4540,17 +4442,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4609,7 +4509,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4623,17 +4523,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4692,7 +4590,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4706,17 +4604,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4783,7 +4679,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4797,17 +4693,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4849,7 +4743,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4863,17 +4757,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4903,7 +4795,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4917,17 +4809,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -4957,7 +4847,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -4971,17 +4861,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -5024,7 +4912,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -5038,17 +4926,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -5076,15 +4962,6 @@ hydrate('Example', { init: initExample, template: (_p) => \`<div bf="s1"><!--bf-
 export function Example(_p, __bfKey) { return createComponent('Example', _p, __bfKey) }"
 `;
-exports[`docs/core/advanced/code-splitting.md doc-examples L98 — (no label) 1`] = `
-"import { createComponent, hydrate } from '@barefootjs/client/runtime'
-function initStatementExample() {}
-hydrate('StatementExample', { init: initStatementExample, template: (_p) => \`<div></div>\` })
-export function StatementExample(_p, __bfKey) { return createComponent('StatementExample', _p, __bfKey) }"
-`;
 exports[`docs/core/advanced/compiler-internals.md doc-examples L126 — (no label) 1`] = `
 "import { $, createComponent, createEffect, createSignal, escapeAttr, escapeText, escapeTextOrNode, hydrate, lazySlots, mapArrayLazy, textOrNode } from '@barefootjs/client/runtime'
@@ -5100,7 +4977,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -5114,17 +4991,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -5245,7 +5120,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -5259,17 +5134,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])
@@ -5328,7 +5201,7 @@ export function initTodoItem(__scope, _p = {}) {
 }
-hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\` })
+hydrate('TodoItem__b3c36eee', { init: initTodoItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.todo))}<!--/--></li>\`, name: 'TodoItem' })
 export function TodoItem(_p, __bfKey) { return createComponent('TodoItem__b3c36eee', _p, __bfKey) }
 export function initItem(__scope, _p = {}) {
   if (!__scope) return
@@ -5342,17 +5215,15 @@ export function initItem(__scope, _p = {}) {
 }
-hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\` })
+hydrate('Item__b3c36eee', { init: initItem, template: (_p) => \`<li bf="s1"><!--bf:s0-->\${escapeText(String(_p.item))}<!--/--></li>\`, name: 'Item' })
 export function Item(_p, __bfKey) { return createComponent('Item__b3c36eee', _p, __bfKey) }
 function initDashboard() {}
-hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\` })
+hydrate('Dashboard__b3c36eee', { init: initDashboard, template: (_p) => \`<div>D</div>\`, name: 'Dashboard' })
 export function Dashboard(_p, __bfKey) { return createComponent('Dashboard__b3c36eee', _p, __bfKey) }
 export function initExample(__scope, _p = {}) {
   if (!__scope) return
   const __scopeId = __scope.getAttribute('bf-s')
-  const children = _p.children
   const [count, setCount] = createSignal(0)
   const [isLoggedIn] = createSignal(false)
   const [todos] = createSignal([])