From 9f2e2bcc663891fbad4f7c7a46457dbe3ff79294 Mon Sep 17 00:00:00 2001
From: Samuel Degueldre <sad@odoo.com>
Date: Wed, 22 Dec 2021 12:33:17 +0100
Subject: [PATCH] [IMP] compiler: scope generated ids to their prefix

This means that unrelated ids (eg the id of a template, variable or key)
not longer share the same incrementing counter, meaning that you no
longer see a variable named "v2" unless another variable "v1" was
generated previously, this is also true for block data.
---
 src/compiler/code_generator.ts                |  15 +-
 .../__snapshots__/event_handling.test.ts.snap |  24 +-
 .../compiler/__snapshots__/misc.test.ts.snap  | 124 ++++-----
 .../__snapshots__/t_call.test.ts.snap         | 136 +++++-----
 .../__snapshots__/t_debug_log.test.ts.snap    |   4 +-
 .../compiler/__snapshots__/t_esc.test.ts.snap |   4 +-
 .../__snapshots__/t_foreach.test.ts.snap      |   8 +-
 .../compiler/__snapshots__/t_out.test.ts.snap |   8 +-
 .../compiler/__snapshots__/t_ref.test.ts.snap |  12 +-
 .../compiler/__snapshots__/t_set.test.ts.snap |   8 +-
 .../__snapshots__/template_set.test.ts.snap   |   8 +-
 .../__snapshots__/basics.test.ts.snap         |  30 +-
 .../__snapshots__/concurrency.test.ts.snap    |   4 +-
 .../__snapshots__/error_handling.test.ts.snap |  56 ++--
 .../__snapshots__/event_handling.test.ts.snap |   8 +-
 .../higher_order_component.test.ts.snap       |   4 +-
 .../__snapshots__/hooks.test.ts.snap          |   4 +-
 .../__snapshots__/lifecycle.test.ts.snap      |   4 +-
 .../__snapshots__/props.test.ts.snap          |   2 +-
 .../props_validation.test.ts.snap             | 138 +++++-----
 .../__snapshots__/refs.test.ts.snap           |  10 +-
 .../__snapshots__/slots.test.ts.snap          | 256 +++++++++---------
 .../__snapshots__/style_class.test.ts.snap    |   4 +-
 .../__snapshots__/t_call.test.ts.snap         |  34 +--
 .../__snapshots__/t_component.test.ts.snap    |  28 +-
 .../__snapshots__/t_foreach.test.ts.snap      |   2 +-
 .../__snapshots__/t_key.test.ts.snap          |  30 +-
 .../__snapshots__/t_model.test.ts.snap        | 126 ++++-----
 .../__snapshots__/t_on.test.ts.snap           |  12 +-
 .../__snapshots__/t_set.test.ts.snap          |   4 +-
 tests/misc/__snapshots__/memo.test.ts.snap    |  10 +-
 tests/misc/__snapshots__/portal.test.ts.snap  |  68 ++---
 32 files changed, 595 insertions(+), 590 deletions(-)

diff --git a/src/compiler/code_generator.ts b/src/compiler/code_generator.ts
index 548b989b..a2f5bedd 100644
--- a/src/compiler/code_generator.ts
+++ b/src/compiler/code_generator.ts
@@ -44,7 +44,11 @@ const xmlDoc = document.implementation.createDocument(null, null, null);
 
 class BlockDescription {
   static nextBlockId = 1;
-  static nextDataId = 1;
+  static nextDataIds: { [key: string]: number } = {};
+  static generateId(prefix: string) {
+    this.nextDataIds[prefix] = (this.nextDataIds[prefix] || 0) + 1;
+    return prefix + this.nextDataIds[prefix];
+  }
 
   varName: string;
   blockName: string;
@@ -70,7 +74,7 @@ class BlockDescription {
   }
 
   insertData(str: string, prefix: string = "d"): number {
-    const id = prefix + BlockDescription.nextDataId++;
+    const id = BlockDescription.generateId(prefix);
     this.target.addLine(`let ${id} = ${str};`);
     return this.data.push(id) - 1;
   }
@@ -189,7 +193,7 @@ const translationRE = /^(\s*)([\s\S]+?)(\s*)$/;
 
 export class CodeGenerator {
   blocks: BlockDescription[] = [];
-  nextId = 1;
+  ids: { [key: string]: number } = {};
   nextBlockId = 1;
   hasSafeContext: boolean;
   isDebug: boolean = false;
@@ -216,7 +220,7 @@ export class CodeGenerator {
     const ast = this.ast;
     this.isDebug = ast.type === ASTType.TDebug;
     BlockDescription.nextBlockId = 1;
-    BlockDescription.nextDataId = 1;
+    BlockDescription.nextDataIds = {};
     this.compileAST(ast, {
       block: null,
       index: 0,
@@ -282,7 +286,8 @@ export class CodeGenerator {
   }
 
   generateId(prefix: string = ""): string {
-    return `${prefix}${this.nextId++}`;
+    this.ids[prefix] = (this.ids[prefix] || 0) + 1;
+    return prefix + this.ids[prefix];
   }
 
   generateBlockName(): string {
diff --git a/tests/compiler/__snapshots__/event_handling.test.ts.snap b/tests/compiler/__snapshots__/event_handling.test.ts.snap
index 003988a2..6428dcbb 100644
--- a/tests/compiler/__snapshots__/event_handling.test.ts.snap
+++ b/tests/compiler/__snapshots__/event_handling.test.ts.snap
@@ -157,10 +157,10 @@ exports[`t-on handler is bound to proper owner, part 3 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -184,7 +184,7 @@ exports[`t-on handler is bound to proper owner, part 4 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
@@ -196,7 +196,7 @@ exports[`t-on handler is bound to proper owner, part 4 1`] = `
       ctx[\`value_index\`] = i1;
       ctx[\`value_value\`] = k_block1[i1];
       let key1 = ctx['value'];
-      c_block1[i1] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
+      c_block1[i1] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
     }
     return list(c_block1);
   }
@@ -255,8 +255,8 @@ exports[`t-on t-on modifiers (native listener) t-on combined with t-esc 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     let hdlr1 = [ctx['onClick'], ctx];
-    let txt2 = ctx['text'];
-    return block1([hdlr1, txt2]);
+    let txt1 = ctx['text'];
+    return block1([hdlr1, txt1]);
   }
 }"
 `;
@@ -354,8 +354,8 @@ exports[`t-on t-on modifiers (native listener) t-on with prevent modifier in t-f
       const v1 = ctx['onEdit'];
       const v2 = ctx['project'];
       let hdlr1 = [\\"prevent\\", ev=>v1(v2.id,ev), ctx];
-      let txt2 = ctx['project'].name;
-      c_block2[i1] = withKey(block3([hdlr1, txt2]), key1);
+      let txt1 = ctx['project'].name;
+      c_block2[i1] = withKey(block3([hdlr1, txt1]), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -473,12 +473,12 @@ exports[`t-on t-on with t-call 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -503,12 +503,12 @@ exports[`t-on t-on, with arguments and t-call 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
diff --git a/tests/compiler/__snapshots__/misc.test.ts.snap b/tests/compiler/__snapshots__/misc.test.ts.snap
index da4c59da..9663a1ba 100644
--- a/tests/compiler/__snapshots__/misc.test.ts.snap
+++ b/tests/compiler/__snapshots__/misc.test.ts.snap
@@ -22,7 +22,7 @@ exports[`misc complex template 1`] = `
     let attr2 = \`card bg-\${ctx['klass']}-light\`;
     let attr3 = \`/runbot/batch/\${ctx['batch'].id}\`;
     let attr4 = \`badge badge-\${ctx['batch'].has_warning?'warning':'light'}\`;
-    let txt5 = ctx['batch'].formated_age;
+    let txt1 = ctx['batch'].formated_age;
     if (ctx['batch'].has_warning) {
       b2 = block2();
     }
@@ -53,8 +53,8 @@ exports[`misc complex template 1`] = `
       ctx[\`commit_link\`] = v_block8[i1];
       let key1 = ctx['commit_link'].id;
       let b10,b11,b12,b13;
-      let attr6 = \`/runbot/commit/\${ctx['commit_link'].commit_id}\`;
-      let attr7 = \`badge badge-light batch_commit match_type_\${ctx['commit_link'].match_type}\`;
+      let attr5 = \`/runbot/commit/\${ctx['commit_link'].commit_id}\`;
+      let attr6 = \`badge badge-light batch_commit match_type_\${ctx['commit_link'].match_type}\`;
       if (ctx['commit_link'].match_type=='new') {
         b10 = block10();
       }
@@ -67,13 +67,13 @@ exports[`misc complex template 1`] = `
       if (ctx['commit_link'].match_type=='base_head') {
         b13 = block13();
       }
-      let txt8 = ctx['commit_link'].commit_dname;
-      let attr9 = 'https://%s/commit/%s'%(ctx['commit_link'].commit_remote_url,ctx['commit_link'].commit_name);
-      let txt10 = ctx['commit_link'].commit_subject;
-      c_block8[i1] = withKey(block9([attr6, attr7, txt8, attr9, txt10], [b10, b11, b12, b13]), key1);
+      let txt2 = ctx['commit_link'].commit_dname;
+      let attr7 = 'https://%s/commit/%s'%(ctx['commit_link'].commit_remote_url,ctx['commit_link'].commit_name);
+      let txt3 = ctx['commit_link'].commit_subject;
+      c_block8[i1] = withKey(block9([attr5, attr6, txt2, attr7, txt3], [b10, b11, b12, b13]), key1);
     }
     b8 = list(c_block8);
-    return block1([attr1, attr2, attr3, attr4, txt5], [b2, b3, b4, b6, b8]);
+    return block1([attr1, attr2, attr3, attr4, txt1], [b2, b3, b4, b6, b8]);
   }
 }"
 `;
@@ -83,11 +83,11 @@ exports[`misc global 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, zero, withKey } = helpers;
+  const callTemplate_1 = getTemplate(\`_callee-uses-foo\`);
   const callTemplate_2 = getTemplate(\`_callee-uses-foo\`);
-  const callTemplate_4 = getTemplate(\`_callee-uses-foo\`);
-  const callTemplate_6 = getTemplate(\`_callee-uses-foo\`);
-  const callTemplate_8 = getTemplate(\`_callee-asc\`);
-  const callTemplate_10 = getTemplate(\`_callee-asc-toto\`);
+  const callTemplate_3 = getTemplate(\`_callee-uses-foo\`);
+  const callTemplate_4 = getTemplate(\`_callee-asc\`);
+  const callTemplate_5 = getTemplate(\`_callee-asc-toto\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   let block4 = createBlock(\`<span><block-text-0/></span>\`);
@@ -111,20 +111,20 @@ exports[`misc global 1`] = `
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"foo\\", 'aaa');
-      let b6 = callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`);
+      let b6 = callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`);
       ctx = ctx.__proto__;
-      let b7 = callTemplate_4.call(this, ctx, node, key + \`__3__\${key1}\`);
+      let b7 = callTemplate_2.call(this, ctx, node, key + \`__2__\${key1}\`);
       setContextValue(ctx, \\"foo\\", 'bbb');
-      let b8 = callTemplate_6.call(this, ctx, node, key + \`__5__\${key1}\`);
+      let b8 = callTemplate_3.call(this, ctx, node, key + \`__3__\${key1}\`);
       let b5 = multi([b6, b7, b8]);
       ctx[zero] = b5;
-      let b9 = callTemplate_8.call(this, ctx, node, key + \`__7__\${key1}\`);
+      let b9 = callTemplate_4.call(this, ctx, node, key + \`__4__\${key1}\`);
       ctx = ctx.__proto__;
       c_block2[i1] = withKey(multi([b4, b9]), key1);
     }
     ctx = ctx.__proto__;
     let b2 = list(c_block2);
-    let b10 = callTemplate_10.call(this, ctx, node, key + \`__9\`);
+    let b10 = callTemplate_5.call(this, ctx, node, key + \`__5\`);
     return block1([], [b2, b10]);
   }
 }"
@@ -182,7 +182,7 @@ exports[`misc other complex template 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, withKey, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`LOAD_INFOS_TEMPLATE\`);
+  const callTemplate_1 = getTemplate(\`LOAD_INFOS_TEMPLATE\`);
   
   let block1 = createBlock(\`<div><header><nav class=\\"navbar navbar-expand-md navbar-light bg-light\\"><a block-attribute-0=\\"href\\"><b style=\\"color:#777;\\"><block-text-1/></b></a><button type=\\"button\\" class=\\"navbar-toggler\\" data-toggle=\\"collapse\\" data-target=\\"#top_menu_collapse\\"><span class=\\"navbar-toggler-icon\\"/></button><div class=\\"collapse navbar-collapse\\" id=\\"top_menu_collapse\\" aria-expanded=\\"false\\"><ul class=\\"nav navbar-nav ml-auto text-right\\" id=\\"top_menu\\"><block-child-0/><li class=\\"nav-item divider\\"/><block-child-1/></ul><div><div class=\\"input-group input-group-sm\\"><div class=\\"input-group-prepend input-group-sm\\"><button class=\\"btn btn-default fa fa-cog\\" title=\\"Settings\\" block-handler-2=\\"click\\"/><button class=\\"btn btn-default\\" block-handler-3=\\"click\\"> More </button><block-child-2/></div><input class=\\"form-control\\" type=\\"text\\" placeholder=\\"Search\\" aria-label=\\"Search\\" name=\\"search\\" block-attribute-4=\\"value\\" block-handler-5=\\"keyup\\" block-handler-6=\\"change\\" block-ref=\\"7\\"/><div class=\\"input-group-append\\"><button class=\\"btn btn-default fa fa-eraser\\" block-handler-8=\\"click\\"/></div></div></div></div></nav></header><div class=\\"container-fluid\\" block-ref=\\"9\\"><div class=\\"row\\"><!--div class=\\"form-group col-md-6\\">
                       <h5>Search options</h5>
@@ -217,29 +217,29 @@ exports[`misc other complex template 1`] = `
     const refs = ctx.__owl__.refs;
     let b2,b4,b14,b17,b22,b23,b24,b25;
     let attr1 = \`/runbot/\${ctx['project'].slug}\`;
-    let txt2 = ctx['project'].name;
+    let txt1 = ctx['project'].name;
     ctx = Object.create(ctx);
     const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['projects']);
     for (let i1 = 0; i1 < l_block2; i1++) {
       ctx[\`project\`] = v_block2[i1];
       let key1 = ctx['project'].id;
-      let hdlr3 = [ctx['selectProject'](ctx['project']), ctx];
-      let txt4 = ctx['project'].name;
-      c_block2[i1] = withKey(block3([hdlr3, txt4]), key1);
+      let hdlr1 = [ctx['selectProject'](ctx['project']), ctx];
+      let txt2 = ctx['project'].name;
+      c_block2[i1] = withKey(block3([hdlr1, txt2]), key1);
     }
     ctx = ctx.__proto__;
     b2 = list(c_block2);
     if (ctx['user']) {
       let b5,b6;
       if (ctx['user'].public) {
-        let attr5 = \`/web/login?redirect=/\`;
-        b5 = block5([attr5]);
+        let attr2 = \`/web/login?redirect=/\`;
+        b5 = block5([attr2]);
       } else {
         let b7,b10,b13;
         if (ctx['nb_assigned_errors']&&ctx['nb_assigned_errors']>0) {
-          let attr6 = \`You have \${ctx['nb_assigned_errors']} random bug assigned\`;
-          let txt7 = ctx['nb_assigned_errors'];
-          let b8 = block8([attr6, txt7]);
+          let attr3 = \`You have \${ctx['nb_assigned_errors']} random bug assigned\`;
+          let txt3 = ctx['nb_assigned_errors'];
+          let b8 = block8([attr3, txt3]);
           let b9 = block9();
           b7 = multi([b8, b9]);
         } else if (ctx['nb_build_errors']&&ctx['nb_build_errors']>0) {
@@ -247,37 +247,37 @@ exports[`misc other complex template 1`] = `
           let b12 = block12();
           b10 = multi([b11, b12]);
         }
-        let txt8 = ctx['user'].name.length>25?ctx['user'].namesubstring(0,23)+'...':ctx['user'].name;
-        let attr9 = \`/web/session/logout?redirect=/\`;
-        let attr10 = \`/web\`;
-        b13 = block13([txt8, attr9, attr10]);
+        let txt4 = ctx['user'].name.length>25?ctx['user'].namesubstring(0,23)+'...':ctx['user'].name;
+        let attr4 = \`/web/session/logout?redirect=/\`;
+        let attr5 = \`/web\`;
+        b13 = block13([txt4, attr4, attr5]);
         b6 = multi([b7, b10, b13]);
       }
       b4 = multi([b5, b6]);
     }
-    let hdlr11 = [ctx['toggleSettingsMenu'], ctx];
-    let hdlr12 = [ctx['toggleMore'], ctx];
+    let hdlr2 = [ctx['toggleSettingsMenu'], ctx];
+    let hdlr3 = [ctx['toggleMore'], ctx];
     if (ctx['categories']&&ctx['categories'].length>1) {
       ctx = Object.create(ctx);
       const [k_block15, v_block15, l_block15, c_block15] = prepareList(ctx['categories']);
       for (let i1 = 0; i1 < l_block15; i1++) {
         ctx[\`category\`] = v_block15[i1];
         let key1 = ctx['category'].id;
-        let attr13 = ctx['category'].id;
-        let attr14 = ctx['category'].id==ctx['options'].active_category_id;
-        let txt15 = ctx['category'].name;
-        c_block15[i1] = withKey(block16([attr13, attr14, txt15]), key1);
+        let attr6 = ctx['category'].id;
+        let attr7 = ctx['category'].id==ctx['options'].active_category_id;
+        let txt5 = ctx['category'].name;
+        c_block15[i1] = withKey(block16([attr6, attr7, txt5]), key1);
       }
       ctx = ctx.__proto__;
       let b15 = list(c_block15);
       b14 = block14([], [b15]);
     }
-    let attr16 = ctx['search'].value;
-    let hdlr17 = [ctx['updateFilter'], ctx];
-    let hdlr18 = [ctx['updateFilter'], ctx];
-    let d19 = (el) => refs[\`search_input\`] = el;
-    let hdlr20 = [ctx['clearSearch'], ctx];
-    let d21 = (el) => refs[\`settings_menu\`] = el;
+    let attr8 = ctx['search'].value;
+    let hdlr4 = [ctx['updateFilter'], ctx];
+    let hdlr5 = [ctx['updateFilter'], ctx];
+    let d1 = (el) => refs[\`search_input\`] = el;
+    let hdlr6 = [ctx['clearSearch'], ctx];
+    let d2 = (el) => refs[\`settings_menu\`] = el;
     if (ctx['triggers']) {
       ctx = Object.create(ctx);
       const [k_block18, v_block18, l_block18, c_block18] = prepareList(ctx['triggers']);
@@ -286,41 +286,41 @@ exports[`misc other complex template 1`] = `
         let key1 = ctx['trigger'].id;
         let b20;
         if (!ctx['trigger'].manual&&ctx['trigger'].project_id===ctx['project'].id&&ctx['trigger'].category_id===ctx['options'].active_category_id) {
-          let attr22 = \`trigger_\${ctx['trigger'].id}\`;
-          let attr23 = \`trigger_\${ctx['trigger'].id}\`;
-          let attr24 = ctx['options'].trigger_display[ctx['trigger'].id];
-          let attr25 = ctx['trigger'].id;
-          let hdlr26 = [ctx['updateTriggerDisplay'], ctx];
-          let attr27 = \`trigger_\${ctx['trigger'].id}\`;
-          let txt28 = ctx['trigger'].name;
-          b20 = block20([attr22, attr23, attr24, attr25, hdlr26, attr27, txt28]);
+          let attr9 = \`trigger_\${ctx['trigger'].id}\`;
+          let attr10 = \`trigger_\${ctx['trigger'].id}\`;
+          let attr11 = ctx['options'].trigger_display[ctx['trigger'].id];
+          let attr12 = ctx['trigger'].id;
+          let hdlr7 = [ctx['updateTriggerDisplay'], ctx];
+          let attr13 = \`trigger_\${ctx['trigger'].id}\`;
+          let txt6 = ctx['trigger'].name;
+          b20 = block20([attr9, attr10, attr11, attr12, hdlr7, attr13, txt6]);
         }
         c_block18[i1] = withKey(multi([b20]), key1);
       }
       ctx = ctx.__proto__;
       let b18 = list(c_block18);
-      let hdlr29 = [ctx['triggerAll'], ctx];
-      let hdlr30 = [ctx['triggerNone'], ctx];
-      let hdlr31 = [ctx['triggerDefault'], ctx];
-      let hdlr32 = [ctx['toggleSettingsMenu'], ctx];
-      let b21 = block21([hdlr29, hdlr30, hdlr31, hdlr32]);
+      let hdlr8 = [ctx['triggerAll'], ctx];
+      let hdlr9 = [ctx['triggerNone'], ctx];
+      let hdlr10 = [ctx['triggerDefault'], ctx];
+      let hdlr11 = [ctx['toggleSettingsMenu'], ctx];
+      let b21 = block21([hdlr8, hdlr9, hdlr10, hdlr11]);
       b17 = multi([b18, b21]);
     }
     if (ctx['load_infos']) {
-      b22 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+      b22 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     }
     if (ctx['message']) {
-      let txt33 = ctx['message'];
-      b23 = block23([txt33]);
+      let txt7 = ctx['message'];
+      b23 = block23([txt7]);
     }
     if (!ctx['project']) {
       b24 = block24();
     } else {
-      let b26 = component(\`BundlesList\`, {bundles: ctx['bundles'].sticky,category_custom_views: ctx['category_custom_views'],search: ctx['search']}, key + \`__3\`, node, ctx);
-      let b27 = component(\`BundlesList\`, {bundles: ctx['bundles'].dev,search: ctx['search']}, key + \`__4\`, node, ctx);
+      let b26 = component(\`BundlesList\`, {bundles: ctx['bundles'].sticky,category_custom_views: ctx['category_custom_views'],search: ctx['search']}, key + \`__2\`, node, ctx);
+      let b27 = component(\`BundlesList\`, {bundles: ctx['bundles'].dev,search: ctx['search']}, key + \`__3\`, node, ctx);
       b25 = block25([], [b26, b27]);
     }
-    return block1([attr1, txt2, hdlr11, hdlr12, attr16, hdlr17, hdlr18, d19, hdlr20, d21], [b2, b4, b14, b17, b22, b23, b24, b25]);
+    return block1([attr1, txt1, hdlr2, hdlr3, attr8, hdlr4, hdlr5, d1, hdlr6, d2], [b2, b4, b14, b17, b22, b23, b24, b25]);
   }
 }"
 `;
diff --git a/tests/compiler/__snapshots__/t_call.test.ts.snap b/tests/compiler/__snapshots__/t_call.test.ts.snap
index ae21669c..a1dbd890 100644
--- a/tests/compiler/__snapshots__/t_call.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_call.test.ts.snap
@@ -5,12 +5,12 @@ exports[`t-call (template calling) basic caller 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`_basic-callee\`);
+  const callTemplate_1 = getTemplate(\`_basic-callee\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -34,10 +34,10 @@ exports[`t-call (template calling) basic caller, no parent node 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`_basic-callee\`);
+  const callTemplate_1 = getTemplate(\`_basic-callee\`);
   
   return function template(ctx, node, key = \\"\\") {
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -60,7 +60,7 @@ exports[`t-call (template calling) call with several sub nodes on same line 1`]
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>hey</span>\`);
@@ -74,7 +74,7 @@ exports[`t-call (template calling) call with several sub nodes on same line 1`]
     let b5 = block5();
     let b2 = multi([b3, b4, b5]);
     ctx[zero] = b2;
-    let b6 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b6 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b6]);
   }
 }"
@@ -100,7 +100,7 @@ exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`subTemplate\`);
+  const callTemplate_1 = getTemplate(\`subTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>hey</span>\`);
@@ -114,7 +114,7 @@ exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
     let b5 = block5();
     let b2 = multi([b3, b4, b5]);
     ctx[zero] = b2;
-    let b6 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b6 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b6]);
   }
 }"
@@ -125,7 +125,7 @@ exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`subSubTemplate\`);
+  const callTemplate_1 = getTemplate(\`subSubTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>cascade 0</span>\`);
@@ -137,7 +137,7 @@ exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
     let b4 = ctx[zero];
     let b2 = multi([b3, b4]);
     ctx[zero] = b2;
-    let b5 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b5 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b5]);
   }
 }"
@@ -148,7 +148,7 @@ exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`finalTemplate\`);
+  const callTemplate_1 = getTemplate(\`finalTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block3 = createBlock(\`<span>cascade 1</span>\`);
@@ -160,7 +160,7 @@ exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
     let b4 = ctx[zero];
     let b2 = multi([b3, b4]);
     ctx[zero] = b2;
-    let b5 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b5 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b5]);
   }
 }"
@@ -186,7 +186,7 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`subTemplate\`);
+  const callTemplate_1 = getTemplate(\`subTemplate\`);
   
   let block2 = createBlock(\`<span>hey</span>\`);
   let block4 = createBlock(\`<span>yay</span>\`);
@@ -199,7 +199,7 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
     let b4 = block4();
     let b1 = multi([b2, b3, b4]);
     ctx[zero] = b1;
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -209,7 +209,7 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`subSubTemplate\`);
+  const callTemplate_1 = getTemplate(\`subSubTemplate\`);
   
   let block2 = createBlock(\`<span>cascade 0</span>\`);
   
@@ -220,7 +220,7 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
     let b3 = ctx[zero];
     let b1 = multi([b2, b3]);
     ctx[zero] = b1;
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -230,7 +230,7 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`finalTemplate\`);
+  const callTemplate_1 = getTemplate(\`finalTemplate\`);
   
   let block2 = createBlock(\`<span>cascade 1</span>\`);
   
@@ -241,7 +241,7 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
     let b3 = ctx[zero];
     let b1 = multi([b2, b3]);
     ctx[zero] = b1;
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -271,8 +271,8 @@ exports[`t-call (template calling) dynamic t-call 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    const template2 = (ctx['template']);
-    let b2 = call(this, template2, ctx, node, key + \`__1\`);
+    const template1 = (ctx['template']);
+    let b2 = call(this, template1, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -311,7 +311,7 @@ exports[`t-call (template calling) inherit context 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -319,7 +319,7 @@ exports[`t-call (template calling) inherit context 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"foo\\", 1);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -341,14 +341,14 @@ exports[`t-call (template calling) recursive template, part 1 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`recursive\`);
+  const callTemplate_1 = getTemplate(\`recursive\`);
   
   let block1 = createBlock(\`<div><span>hey</span><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
     let b2;
     if (false) {
-      b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+      b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     }
     return block1([], [b2]);
   }
@@ -360,7 +360,7 @@ exports[`t-call (template calling) recursive template, part 2 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`nodeTemplate\`);
+  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -370,7 +370,7 @@ exports[`t-call (template calling) recursive template, part 2 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"node\\", ctx['root']);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -381,7 +381,7 @@ exports[`t-call (template calling) recursive template, part 2 2`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`nodeTemplate\`);
+  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/></div>\`);
   
@@ -401,7 +401,7 @@ exports[`t-call (template calling) recursive template, part 2 2`] = `
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"node\\", ctx['subtree']);
-      c_block2[i1] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
+      c_block2[i1] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
       ctx = ctx.__proto__;
     }
     let b2 = list(c_block2);
@@ -415,7 +415,7 @@ exports[`t-call (template calling) recursive template, part 3 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`nodeTemplate\`);
+  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -425,7 +425,7 @@ exports[`t-call (template calling) recursive template, part 3 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"node\\", ctx['root']);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -436,7 +436,7 @@ exports[`t-call (template calling) recursive template, part 3 2`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`nodeTemplate\`);
+  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/></div>\`);
   
@@ -456,7 +456,7 @@ exports[`t-call (template calling) recursive template, part 3 2`] = `
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"node\\", ctx['subtree']);
-      c_block2[i1] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
+      c_block2[i1] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
       ctx = ctx.__proto__;
     }
     let b2 = list(c_block2);
@@ -470,7 +470,7 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`nodeTemplate\`);
+  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -481,7 +481,7 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"recursive_idx\\", 1);
     setContextValue(ctx, \\"node\\", ctx['root']);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -492,7 +492,7 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, prepareList, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`nodeTemplate\`);
+  const callTemplate_1 = getTemplate(\`nodeTemplate\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/> <block-text-1/></p><block-child-0/></div>\`);
   
@@ -514,7 +514,7 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"node\\", ctx['subtree']);
-      c_block2[i1] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
+      c_block2[i1] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
       ctx = ctx.__proto__;
     }
     let b2 = list(c_block2);
@@ -528,7 +528,7 @@ exports[`t-call (template calling) scoped parameters 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
   
@@ -538,7 +538,7 @@ exports[`t-call (template calling) scoped parameters 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"foo\\", 42);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     ctx = ctx.__proto__;
     let txt1 = ctx['foo'];
     return block1([txt1], [b2]);
@@ -562,7 +562,7 @@ exports[`t-call (template calling) scoped parameters, part 2 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
   
@@ -573,7 +573,7 @@ exports[`t-call (template calling) scoped parameters, part 2 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"foo\\", 42);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     ctx = ctx.__proto__;
     let txt1 = ctx['foo'];
     return block1([txt1], [b2]);
@@ -597,12 +597,12 @@ exports[`t-call (template calling) t-call allowed on a non t node 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -626,7 +626,7 @@ exports[`t-call (template calling) t-call with body content as root of a templat
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`antony\`);
+  const callTemplate_1 = getTemplate(\`antony\`);
   
   let block1 = createBlock(\`<p>antony</p>\`);
   
@@ -635,7 +635,7 @@ exports[`t-call (template calling) t-call with body content as root of a templat
     ctx[isBoundary] = 1;
     let b1 = block1();
     ctx[zero] = b1;
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -660,14 +660,14 @@ exports[`t-call (template calling) t-call with t-if 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
     let b2;
     if (ctx['flag']) {
-      b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+      b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     }
     return block1([], [b2]);
   }
@@ -692,7 +692,7 @@ exports[`t-call (template calling) t-call with t-set inside and body text conten
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -702,7 +702,7 @@ exports[`t-call (template calling) t-call with t-set inside and body text conten
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"val\\", \`yip yip\`);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -727,7 +727,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -747,7 +747,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside 1`] = `
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"val3\\", ctx['val']*3);
-      c_block2[i1] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
+      c_block2[i1] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
       ctx = ctx.__proto__;
     }
     let b2 = list(c_block2);
@@ -775,7 +775,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 1`] =
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`main\`);
+  const callTemplate_1 = getTemplate(\`main\`);
   
   let block1 = createBlock(\`<p><block-child-0/></p>\`);
   
@@ -783,7 +783,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 1`] =
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"w\\", 'fromwrapper');
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -794,7 +794,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] =
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -814,7 +814,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] =
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"val3\\", ctx['val']*3);
-      c_block2[i1] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
+      c_block2[i1] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
       ctx = ctx.__proto__;
     }
     let b2 = list(c_block2);
@@ -844,8 +844,8 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`callee1\`);
-  const callTemplate_4 = getTemplate(\`callee2\`);
+  const callTemplate_1 = getTemplate(\`callee1\`);
+  const callTemplate_2 = getTemplate(\`callee2\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
@@ -855,12 +855,12 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
     let b2,b3;
     setContextValue(ctx, \\"v1\\", 'elif');
     if (ctx['v1']==='if') {
-      b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+      b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     } else if (ctx['v1']==='elif') {
       ctx = Object.create(ctx);
       ctx[isBoundary] = 1;
       setContextValue(ctx, \\"v\\", 'success');
-      b3 = callTemplate_4.call(this, ctx, node, key + \`__3\`);
+      b3 = callTemplate_2.call(this, ctx, node, key + \`__2\`);
       ctx = ctx.__proto__;
     }
     return block1([], [b2, b3]);
@@ -900,7 +900,7 @@ exports[`t-call (template calling) t-esc inside t-call, with t-set outside 1`] =
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -908,7 +908,7 @@ exports[`t-call (template calling) t-esc inside t-call, with t-set outside 1`] =
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"v\\", \`Hi\`);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -933,14 +933,14 @@ exports[`t-call (template calling) with unused body 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     let b1 = text(\`WHEEE\`);
     ctx[zero] = b1;
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -963,7 +963,7 @@ exports[`t-call (template calling) with unused setbody 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
@@ -971,7 +971,7 @@ exports[`t-call (template calling) with unused setbody 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"qux\\", 3);
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -994,14 +994,14 @@ exports[`t-call (template calling) with used body 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   return function template(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     let b1 = text(\`ok\`);
     ctx[zero] = b1;
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -1026,7 +1026,7 @@ exports[`t-call (template calling) with used setbody 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<span><block-child-0/></span>\`);
   
@@ -1036,7 +1036,7 @@ exports[`t-call (template calling) with used setbody 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"foo\\", 'ok');
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
diff --git a/tests/compiler/__snapshots__/t_debug_log.test.ts.snap b/tests/compiler/__snapshots__/t_debug_log.test.ts.snap
index c29d1726..f3b72b95 100644
--- a/tests/compiler/__snapshots__/t_debug_log.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_debug_log.test.ts.snap
@@ -39,12 +39,12 @@ exports[`debugging t-debug on sub template 2`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
diff --git a/tests/compiler/__snapshots__/t_esc.test.ts.snap b/tests/compiler/__snapshots__/t_esc.test.ts.snap
index 5634f77c..c2489667 100644
--- a/tests/compiler/__snapshots__/t_esc.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_esc.test.ts.snap
@@ -149,7 +149,7 @@ exports[`t-esc t-esc=0 is escaped 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block2 = createBlock(\`<p>escaped</p>\`);
@@ -159,7 +159,7 @@ exports[`t-esc t-esc=0 is escaped 1`] = `
     ctx[isBoundary] = 1;
     let b2 = block2();
     ctx[zero] = b2;
-    let b3 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b3 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b3]);
   }
 }"
diff --git a/tests/compiler/__snapshots__/t_foreach.test.ts.snap b/tests/compiler/__snapshots__/t_foreach.test.ts.snap
index 68b46298..088ebd27 100644
--- a/tests/compiler/__snapshots__/t_foreach.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_foreach.test.ts.snap
@@ -216,7 +216,7 @@ exports[`t-foreach t-call with body in t-foreach in t-foreach 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/><span>[<block-text-0/>][<block-text-1/>][<block-text-2/>]</span></div>\`);
   let block6 = createBlock(\`<span><block-text-0/></span>\`);
@@ -245,7 +245,7 @@ exports[`t-foreach t-call with body in t-foreach in t-foreach 1`] = `
         ctx = Object.create(ctx);
         ctx[isBoundary] = 1;
         setContextValue(ctx, \\"c\\", 'x'+'_'+ctx['a']+'_'+ctx['b']);
-        c_block4[i2] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}__\${key2}\`), key2);
+        c_block4[i2] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}__\${key2}\`), key2);
         ctx = ctx.__proto__;
       }
       ctx = ctx.__proto__;
@@ -287,7 +287,7 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/><span>[<block-text-0/>][<block-text-1/>][<block-text-2/>]</span></div>\`);
   let block6 = createBlock(\`<span><block-text-0/></span>\`);
@@ -311,7 +311,7 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
         ctx[\`b_index\`] = i2;
         ctx[\`b_value\`] = k_block4[i2];
         let key2 = ctx['b'];
-        c_block4[i2] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}__\${key2}\`), key2);
+        c_block4[i2] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}__\${key2}\`), key2);
       }
       ctx = ctx.__proto__;
       let b4 = list(c_block4);
diff --git a/tests/compiler/__snapshots__/t_out.test.ts.snap b/tests/compiler/__snapshots__/t_out.test.ts.snap
index 4c0b4a9b..69190bb8 100644
--- a/tests/compiler/__snapshots__/t_out.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_out.test.ts.snap
@@ -32,7 +32,7 @@ exports[`t-out multiple calls to t-out 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block2 = createBlock(\`<span>coucou</span>\`);
@@ -42,7 +42,7 @@ exports[`t-out multiple calls to t-out 1`] = `
     ctx[isBoundary] = 1;
     let b2 = block2();
     ctx[zero] = b2;
-    let b3 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b3 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b3]);
   }
 }"
@@ -84,7 +84,7 @@ exports[`t-out t-out 0 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, zero, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`_basic-callee\`);
+  const callTemplate_1 = getTemplate(\`_basic-callee\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block2 = createBlock(\`<div>zero</div>\`);
@@ -94,7 +94,7 @@ exports[`t-out t-out 0 1`] = `
     ctx[isBoundary] = 1;
     let b2 = block2();
     ctx[zero] = b2;
-    let b3 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b3 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b3]);
   }
 }"
diff --git a/tests/compiler/__snapshots__/t_ref.test.ts.snap b/tests/compiler/__snapshots__/t_ref.test.ts.snap
index ba60a01b..b0a545d5 100644
--- a/tests/compiler/__snapshots__/t_ref.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_ref.test.ts.snap
@@ -36,12 +36,12 @@ exports[`t-ref ref in a t-call 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -99,10 +99,10 @@ exports[`t-ref refs in a loop 1`] = `
       ctx[\`item\`] = v_block2[i1];
       let key1 = ctx['item'];
       const tKey_1 = ctx['item'];
-      const v2 = ctx['item'];
-      let ref1 = (el) => refs[\`\${v2}\`] = el;
-      let txt2 = ctx['item'];
-      c_block2[i1] = withKey(block3([ref1, txt2]), tKey_1 + key1);
+      const v1 = ctx['item'];
+      let ref1 = (el) => refs[\`\${v1}\`] = el;
+      let txt1 = ctx['item'];
+      c_block2[i1] = withKey(block3([ref1, txt1]), tKey_1 + key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
diff --git a/tests/compiler/__snapshots__/t_set.test.ts.snap b/tests/compiler/__snapshots__/t_set.test.ts.snap
index cfcc31d8..578371df 100644
--- a/tests/compiler/__snapshots__/t_set.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_set.test.ts.snap
@@ -188,7 +188,7 @@ exports[`t-set t-set can't alter from within callee 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
   
@@ -197,7 +197,7 @@ exports[`t-set t-set can't alter from within callee 1`] = `
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"iter\\", 'source');
     let txt1 = ctx['iter'];
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     let txt2 = ctx['iter'];
     return block1([txt1, txt2], [b2]);
   }
@@ -228,7 +228,7 @@ exports[`t-set t-set can't alter in t-call body 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
   
@@ -240,7 +240,7 @@ exports[`t-set t-set can't alter in t-call body 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"iter\\", 'inCall');
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     ctx = ctx.__proto__;
     let txt2 = ctx['iter'];
     return block1([txt1, txt2], [b2]);
diff --git a/tests/compiler/__snapshots__/template_set.test.ts.snap b/tests/compiler/__snapshots__/template_set.test.ts.snap
index 32ceedd5..89977ba7 100644
--- a/tests/compiler/__snapshots__/template_set.test.ts.snap
+++ b/tests/compiler/__snapshots__/template_set.test.ts.snap
@@ -31,12 +31,12 @@ exports[`loading templates can load a few templates from a xml string 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`items\`);
+  const callTemplate_1 = getTemplate(\`items\`);
   
   let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -63,12 +63,12 @@ exports[`loading templates can load a few templates from an XMLDocument 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`items\`);
+  const callTemplate_1 = getTemplate(\`items\`);
   
   let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
diff --git a/tests/components/__snapshots__/basics.test.ts.snap b/tests/components/__snapshots__/basics.test.ts.snap
index 4729f61a..694811c8 100644
--- a/tests/components/__snapshots__/basics.test.ts.snap
+++ b/tests/components/__snapshots__/basics.test.ts.snap
@@ -78,8 +78,8 @@ exports[`basics can be clicked on and updated 1`] = `
   return function template(ctx, node, key = \\"\\") {
     let txt1 = ctx['state'].counter;
     const v1 = ctx['state'];
-    let hdlr2 = [()=>v1.counter++, ctx];
-    return block1([txt1, hdlr2]);
+    let hdlr1 = [()=>v1.counter++, ctx];
+    return block1([txt1, hdlr1]);
   }
 }"
 `;
@@ -117,10 +117,10 @@ exports[`basics can inject values in tagged templates 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   return function template(ctx, node, key = \\"\\") {
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -455,8 +455,8 @@ exports[`basics reconciliation alg is not confused in some specific situation 1`
   
   return function template(ctx, node, key = \\"\\") {
     let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
-    const tKey_2 = 4;
-    let b3 = toggler(tKey_2, component(\`Child\`, {}, tKey_2 + key + \`__3\`, node, ctx));
+    const tKey_1 = 4;
+    let b3 = toggler(tKey_1, component(\`Child\`, {}, tKey_1 + key + \`__2\`, node, ctx));
     return block1([], [b2, b3]);
   }
 }"
@@ -496,8 +496,8 @@ exports[`basics rerendering a widget with a sub widget 2`] = `
   return function template(ctx, node, key = \\"\\") {
     let txt1 = ctx['state'].counter;
     const v1 = ctx['state'];
-    let hdlr2 = [()=>v1.counter++, ctx];
-    return block1([txt1, hdlr2]);
+    let hdlr1 = [()=>v1.counter++, ctx];
+    return block1([txt1, hdlr1]);
   }
 }"
 `;
@@ -511,9 +511,9 @@ exports[`basics same t-keys in two different places 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = 1;
-    let b2 = toggler(tKey_1, component(\`Child\`, {blip: '1'}, tKey_1 + key + \`__2\`, node, ctx));
-    const tKey_3 = 1;
-    let b3 = toggler(tKey_3, component(\`Child\`, {blip: '2'}, tKey_3 + key + \`__4\`, node, ctx));
+    let b2 = toggler(tKey_1, component(\`Child\`, {blip: '1'}, tKey_1 + key + \`__1\`, node, ctx));
+    const tKey_2 = 1;
+    let b3 = toggler(tKey_2, component(\`Child\`, {blip: '2'}, tKey_2 + key + \`__2\`, node, ctx));
     return block1([], [b2, b3]);
   }
 }"
@@ -753,9 +753,9 @@ exports[`basics t-key on a component with t-if, and a sibling component 1`] = `
     let b2,b3;
     if (false) {
       const tKey_1 = 'str';
-      b2 = toggler(tKey_1, component(\`Child\`, {}, tKey_1 + key + \`__2\`, node, ctx));
+      b2 = toggler(tKey_1, component(\`Child\`, {}, tKey_1 + key + \`__1\`, node, ctx));
     }
-    b3 = component(\`Child\`, {}, key + \`__3\`, node, ctx);
+    b3 = component(\`Child\`, {}, key + \`__2\`, node, ctx);
     return block1([], [b2, b3]);
   }
 }"
@@ -875,7 +875,7 @@ exports[`basics update props of component without concrete own node 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['childProps'].key;
-    let b2 = toggler(tKey_1, component(\`Child\`, ctx['childProps'], tKey_1 + key + \`__2\`, node, ctx));
+    let b2 = toggler(tKey_1, component(\`Child\`, ctx['childProps'], tKey_1 + key + \`__1\`, node, ctx));
     return block1([], [b2]);
   }
 }"
@@ -888,7 +888,7 @@ exports[`basics update props of component without concrete own node 2`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['props'].subKey;
-    return toggler(tKey_1, component(\`Custom\`, {key: ctx['props'].key,subKey: ctx['props'].subKey}, tKey_1 + key + \`__2\`, node, ctx));
+    return toggler(tKey_1, component(\`Custom\`, {key: ctx['props'].key,subKey: ctx['props'].subKey}, tKey_1 + key + \`__1\`, node, ctx));
   }
 }"
 `;
diff --git a/tests/components/__snapshots__/concurrency.test.ts.snap b/tests/components/__snapshots__/concurrency.test.ts.snap
index c7426e20..a0c98bda 100644
--- a/tests/components/__snapshots__/concurrency.test.ts.snap
+++ b/tests/components/__snapshots__/concurrency.test.ts.snap
@@ -20,7 +20,7 @@ exports[`calling render in destroy 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['key'];
-    return toggler(tKey_1, component(\`B\`, {fromA: ctx['state']}, tKey_1 + key + \`__2\`, node, ctx));
+    return toggler(tKey_1, component(\`B\`, {fromA: ctx['state']}, tKey_1 + key + \`__1\`, node, ctx));
   }
 }"
 `;
@@ -1154,7 +1154,7 @@ exports[`two renderings initiated between willPatch and patched 1`] = `
     let b2;
     if (ctx['state'].flag) {
       const tKey_1 = 'panel_'+ctx['state'].panel;
-      b2 = toggler(tKey_1, component(\`Panel\`, {val: ctx['state'].panel}, tKey_1 + key + \`__2\`, node, ctx));
+      b2 = toggler(tKey_1, component(\`Panel\`, {val: ctx['state'].panel}, tKey_1 + key + \`__1\`, node, ctx));
     }
     return block1([], [b2]);
   }
diff --git a/tests/components/__snapshots__/error_handling.test.ts.snap b/tests/components/__snapshots__/error_handling.test.ts.snap
index 04c009d1..7af49872 100644
--- a/tests/components/__snapshots__/error_handling.test.ts.snap
+++ b/tests/components/__snapshots__/error_handling.test.ts.snap
@@ -80,11 +80,11 @@ exports[`can catch errors can catch an error in a component render function 1`]
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {flag: ctx['state'].flag}, key + \`__2\`, node, ctx);
+    return component(\`ErrorComponent\`, {flag: ctx['state'].flag}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -132,11 +132,11 @@ exports[`can catch errors can catch an error in the constructor call of a compon
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
+    return component(\`ErrorComponent\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -170,13 +170,13 @@ exports[`can catch errors can catch an error in the constructor call of a compon
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    let b3 = component(\`ClassicCompoent\`, {}, key + \`__2\`, node, ctx);
-    let b4 = component(\`ErrorComponent\`, {}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ClassicCompoent\`, {}, key + \`__1\`, node, ctx);
+    let b4 = component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
     return multi([b3, b4]);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b5 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__4\`, node, ctx);
+    let b5 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -249,11 +249,11 @@ exports[`can catch errors can catch an error in the initial call of a component
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
+    return component(\`ErrorComponent\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -301,13 +301,13 @@ exports[`can catch errors can catch an error in the initial call of a component
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
+    return component(\`ErrorComponent\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let b3;
     if (ctx['state'].flag) {
-      b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+      b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     }
     return block1([], [b3]);
   }
@@ -445,11 +445,11 @@ exports[`can catch errors can catch an error in the mounted call 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
+    return component(\`ErrorComponent\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -496,12 +496,12 @@ exports[`can catch errors can catch an error in the willPatch call 1`] = `
   let block1 = createBlock(\`<div><span><block-text-0/></span><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {message: ctx['state'].message}, key + \`__2\`, node, ctx);
+    return component(\`ErrorComponent\`, {message: ctx['state'].message}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let txt1 = ctx['state'].message;
-    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([txt1], [b3]);
   }
 }"
@@ -549,11 +549,11 @@ exports[`can catch errors can catch an error in the willStart call 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
+    return component(\`ErrorComponent\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -600,13 +600,13 @@ exports[`can catch errors can catch an error origination from a child's willStar
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    let b3 = component(\`ClassicCompoent\`, {}, key + \`__2\`, node, ctx);
-    let b4 = component(\`ErrorComponent\`, {}, key + \`__3\`, node, ctx);
+    let b3 = component(\`ClassicCompoent\`, {}, key + \`__1\`, node, ctx);
+    let b4 = component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
     return multi([b3, b4]);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b5 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__4\`, node, ctx);
+    let b5 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -711,9 +711,9 @@ exports[`can catch errors catching error, rethrow, render parent  -- a main comp
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, capture, withKey } = helpers;
   
-  function slot3(ctx, node, key = \\"\\") {
-    let Comp5 = ctx['cp'].Comp;
-    return toggler(Comp5, component(Comp5, {}, key + \`__4\`, node, ctx));
+  function slot1(ctx, node, key = \\"\\") {
+    let Comp1 = ctx['cp'].Comp;
+    return toggler(Comp1, component(Comp1, {}, key + \`__1\`, node, ctx));
   }
   
   return function template(ctx, node, key = \\"\\") {
@@ -723,8 +723,8 @@ exports[`can catch errors catching error, rethrow, render parent  -- a main comp
       ctx[\`cp\`] = v_block1[i1];
       let key1 = ctx['cp'].id;
       const v1 = ctx['cp'];
-      const ctx2 = capture(ctx);
-      c_block1[i1] = withKey(component(\`ErrorHandler\`, {onError: ()=>this.cleanUp(v1.id),slots: {'default': {__render: slot3, __ctx: ctx2}}}, key + \`__6__\${key1}\`, node, ctx), key1);
+      const ctx1 = capture(ctx);
+      c_block1[i1] = withKey(component(\`ErrorHandler\`, {onError: ()=>this.cleanUp(v1.id),slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__2__\${key1}\`, node, ctx), key1);
     }
     return list(c_block1);
   }
@@ -787,13 +787,13 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
   
   let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
-    return component(\`ErrorComponent\`, {}, key + \`__3\`, node, ctx);
+  function slot1(ctx, node, key = \\"\\") {
+    return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let b2 = component(\`OK\`, {}, key + \`__1\`, node, ctx);
-    let b4 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__4\`, node, ctx);
+    let b4 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
     return block1([], [b2, b4]);
   }
 }"
diff --git a/tests/components/__snapshots__/event_handling.test.ts.snap b/tests/components/__snapshots__/event_handling.test.ts.snap
index 9825dab3..5c71d1cd 100644
--- a/tests/components/__snapshots__/event_handling.test.ts.snap
+++ b/tests/components/__snapshots__/event_handling.test.ts.snap
@@ -10,8 +10,8 @@ exports[`event handling handler receive the event as argument 1`] = `
   return function template(ctx, node, key = \\"\\") {
     let hdlr1 = [ctx['inc'], ctx];
     let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
-    let txt2 = ctx['state'].value;
-    return block1([hdlr1, txt2], [b2]);
+    let txt1 = ctx['state'].value;
+    return block1([hdlr1, txt1], [b2]);
   }
 }"
 `;
@@ -64,8 +64,8 @@ exports[`event handling support for callable expression in event handler 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     let txt1 = ctx['state'].value;
-    let hdlr2 = [ctx['obj'].onInput, ctx];
-    return block1([txt1, hdlr2]);
+    let hdlr1 = [ctx['obj'].onInput, ctx];
+    return block1([txt1, hdlr1]);
   }
 }"
 `;
diff --git a/tests/components/__snapshots__/higher_order_component.test.ts.snap b/tests/components/__snapshots__/higher_order_component.test.ts.snap
index a66ea9fd..0d4b5afe 100644
--- a/tests/components/__snapshots__/higher_order_component.test.ts.snap
+++ b/tests/components/__snapshots__/higher_order_component.test.ts.snap
@@ -133,8 +133,8 @@ exports[`basics sub widget is interactive 2`] = `
   
   return function template(ctx, node, key = \\"\\") {
     let hdlr1 = [ctx['inc'], ctx];
-    let txt2 = ctx['state'].val;
-    return block1([hdlr1, txt2]);
+    let txt1 = ctx['state'].val;
+    return block1([hdlr1, txt1]);
   }
 }"
 `;
diff --git a/tests/components/__snapshots__/hooks.test.ts.snap b/tests/components/__snapshots__/hooks.test.ts.snap
index 00f1d25e..31953967 100644
--- a/tests/components/__snapshots__/hooks.test.ts.snap
+++ b/tests/components/__snapshots__/hooks.test.ts.snap
@@ -282,8 +282,8 @@ exports[`hooks useRef hook: basic use 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const refs = ctx.__owl__.refs;
     let d1 = (el) => refs[\`button\`] = el;
-    let txt2 = ctx['value'];
-    return block1([d1, txt2]);
+    let txt1 = ctx['value'];
+    return block1([d1, txt1]);
   }
 }"
 `;
diff --git a/tests/components/__snapshots__/lifecycle.test.ts.snap b/tests/components/__snapshots__/lifecycle.test.ts.snap
index b16074f9..a3b81860 100644
--- a/tests/components/__snapshots__/lifecycle.test.ts.snap
+++ b/tests/components/__snapshots__/lifecycle.test.ts.snap
@@ -491,8 +491,8 @@ exports[`lifecycle hooks onWillRender 2`] = `
   
   return function template(ctx, node, key = \\"\\") {
     let hdlr1 = [ctx['increment'], ctx];
-    let txt2 = ctx['state'].value;
-    return block1([hdlr1, txt2]);
+    let txt1 = ctx['state'].value;
+    return block1([hdlr1, txt1]);
   }
 }"
 `;
diff --git a/tests/components/__snapshots__/props.test.ts.snap b/tests/components/__snapshots__/props.test.ts.snap
index 533af68b..19385916 100644
--- a/tests/components/__snapshots__/props.test.ts.snap
+++ b/tests/components/__snapshots__/props.test.ts.snap
@@ -42,7 +42,7 @@ exports[`basics arrow functions as prop correctly capture their scope 1`] = `
       let key1 = ctx['item'].val;
       const v1 = ctx['onClick'];
       const v2 = ctx['item'];
-      c_block1[i1] = withKey(component(\`Child\`, {onClick: ev=>v1(v2.val,ev)}, key + \`__3__\${key1}\`, node, ctx), key1);
+      c_block1[i1] = withKey(component(\`Child\`, {onClick: ev=>v1(v2.val,ev)}, key + \`__1__\${key1}\`, node, ctx), key1);
     }
     return list(c_block1);
   }
diff --git a/tests/components/__snapshots__/props_validation.test.ts.snap b/tests/components/__snapshots__/props_validation.test.ts.snap
index 0727891b..60548b0b 100644
--- a/tests/components/__snapshots__/props_validation.test.ts.snap
+++ b/tests/components/__snapshots__/props_validation.test.ts.snap
@@ -10,7 +10,7 @@ exports[`default props can set default required boolean values 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -46,7 +46,7 @@ exports[`default props can set default values 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -76,7 +76,7 @@ exports[`default props default values are also set whenever component is updated
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['state'].p}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -104,7 +104,7 @@ exports[`props validation can specify that additional props are allowed (array)
   return function template(ctx, node, key = \\"\\") {
     const props1 = {message: 'm',otherProp: 'o'}
     helpers.validateProps(\`Child\`, props1, ctx)
-    return component(\`Child\`, props1, key + \`__2\`, node, ctx);
+    return component(\`Child\`, props1, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -130,7 +130,7 @@ exports[`props validation can specify that additional props are allowed (object)
   return function template(ctx, node, key = \\"\\") {
     const props1 = {message: 'm',otherProp: 'o'}
     helpers.validateProps(\`Child\`, props1, ctx)
-    return component(\`Child\`, props1, key + \`__2\`, node, ctx);
+    return component(\`Child\`, props1, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -158,7 +158,7 @@ exports[`props validation can validate a prop with multiple types 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -187,7 +187,7 @@ exports[`props validation can validate a prop with multiple types 3`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -216,7 +216,7 @@ exports[`props validation can validate a prop with multiple types 5`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -232,7 +232,7 @@ exports[`props validation can validate an array with given primitive type 1`] =
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -261,7 +261,7 @@ exports[`props validation can validate an array with given primitive type 3`] =
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -290,7 +290,7 @@ exports[`props validation can validate an array with given primitive type 5`] =
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -306,7 +306,7 @@ exports[`props validation can validate an array with given primitive type 6`] =
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -322,7 +322,7 @@ exports[`props validation can validate an array with multiple sub element types
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -351,7 +351,7 @@ exports[`props validation can validate an array with multiple sub element types
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -380,7 +380,7 @@ exports[`props validation can validate an array with multiple sub element types
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -409,7 +409,7 @@ exports[`props validation can validate an array with multiple sub element types
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -425,7 +425,7 @@ exports[`props validation can validate an object with simple shape 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -454,7 +454,7 @@ exports[`props validation can validate an object with simple shape 3`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -470,7 +470,7 @@ exports[`props validation can validate an object with simple shape 4`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -486,7 +486,7 @@ exports[`props validation can validate an object with simple shape 5`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -502,7 +502,7 @@ exports[`props validation can validate an optional props 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -531,7 +531,7 @@ exports[`props validation can validate an optional props 3`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -560,7 +560,7 @@ exports[`props validation can validate an optional props 5`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -576,7 +576,7 @@ exports[`props validation can validate recursively complicated prop def 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -605,7 +605,7 @@ exports[`props validation can validate recursively complicated prop def 3`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -634,7 +634,7 @@ exports[`props validation can validate recursively complicated prop def 5`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -650,7 +650,7 @@ exports[`props validation default values are applied before validating props at
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['state'].p}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -680,7 +680,7 @@ exports[`props validation missing required boolean prop causes an error 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -696,7 +696,7 @@ exports[`props validation mix of optional and mandatory 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {}
     helpers.validateProps(\`Child\`, props1, ctx)
-    let b2 = component(\`Child\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`Child\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -712,7 +712,7 @@ exports[`props validation props are validated in dev mode (code snapshot) 1`] =
   return function template(ctx, node, key = \\"\\") {
     const props1 = {message: 1}
     helpers.validateProps(\`Child\`, props1, ctx)
-    let b2 = component(\`Child\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`Child\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -742,7 +742,7 @@ exports[`props validation props are validated whenever component is updated 1`]
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['state'].p}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -772,7 +772,7 @@ exports[`props validation props: list of strings 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -788,7 +788,7 @@ exports[`props validation validate simple types 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -804,7 +804,7 @@ exports[`props validation validate simple types 2`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -833,7 +833,7 @@ exports[`props validation validate simple types 4`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -849,7 +849,7 @@ exports[`props validation validate simple types 5`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -865,7 +865,7 @@ exports[`props validation validate simple types 6`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -894,7 +894,7 @@ exports[`props validation validate simple types 8`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -910,7 +910,7 @@ exports[`props validation validate simple types 9`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -926,7 +926,7 @@ exports[`props validation validate simple types 10`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -955,7 +955,7 @@ exports[`props validation validate simple types 12`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -971,7 +971,7 @@ exports[`props validation validate simple types 13`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -987,7 +987,7 @@ exports[`props validation validate simple types 14`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1016,7 +1016,7 @@ exports[`props validation validate simple types 16`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1032,7 +1032,7 @@ exports[`props validation validate simple types 17`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1048,7 +1048,7 @@ exports[`props validation validate simple types 18`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1077,7 +1077,7 @@ exports[`props validation validate simple types 20`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1093,7 +1093,7 @@ exports[`props validation validate simple types 21`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1109,7 +1109,7 @@ exports[`props validation validate simple types 22`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1138,7 +1138,7 @@ exports[`props validation validate simple types 24`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1154,7 +1154,7 @@ exports[`props validation validate simple types, alternate form 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1170,7 +1170,7 @@ exports[`props validation validate simple types, alternate form 2`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1199,7 +1199,7 @@ exports[`props validation validate simple types, alternate form 4`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1215,7 +1215,7 @@ exports[`props validation validate simple types, alternate form 5`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1231,7 +1231,7 @@ exports[`props validation validate simple types, alternate form 6`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1260,7 +1260,7 @@ exports[`props validation validate simple types, alternate form 8`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1276,7 +1276,7 @@ exports[`props validation validate simple types, alternate form 9`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1292,7 +1292,7 @@ exports[`props validation validate simple types, alternate form 10`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1321,7 +1321,7 @@ exports[`props validation validate simple types, alternate form 12`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1337,7 +1337,7 @@ exports[`props validation validate simple types, alternate form 13`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1353,7 +1353,7 @@ exports[`props validation validate simple types, alternate form 14`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1382,7 +1382,7 @@ exports[`props validation validate simple types, alternate form 16`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1398,7 +1398,7 @@ exports[`props validation validate simple types, alternate form 17`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1414,7 +1414,7 @@ exports[`props validation validate simple types, alternate form 18`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1443,7 +1443,7 @@ exports[`props validation validate simple types, alternate form 20`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1459,7 +1459,7 @@ exports[`props validation validate simple types, alternate form 21`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1475,7 +1475,7 @@ exports[`props validation validate simple types, alternate form 22`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1504,7 +1504,7 @@ exports[`props validation validate simple types, alternate form 24`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {p: ctx['p']}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -1520,7 +1520,7 @@ exports[`props validation validation is only done in dev mode 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const props1 = {}
     helpers.validateProps(\`SubComp\`, props1, ctx)
-    let b2 = component(\`SubComp\`, props1, key + \`__2\`, node, ctx);
+    let b2 = component(\`SubComp\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
diff --git a/tests/components/__snapshots__/refs.test.ts.snap b/tests/components/__snapshots__/refs.test.ts.snap
index 56e17340..2c7d9b9a 100644
--- a/tests/components/__snapshots__/refs.test.ts.snap
+++ b/tests/components/__snapshots__/refs.test.ts.snap
@@ -24,17 +24,17 @@ exports[`refs refs are properly bound in slots 1`] = `
   let block1 = createBlock(\`<div><span class=\\"counter\\"><block-text-0/></span><block-child-0/></div>\`);
   let block2 = createBlock(\`<button block-handler-0=\\"click\\" block-ref=\\"1\\">do something</button>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     const refs = ctx.__owl__.refs;
-    let hdlr2 = [ctx['doSomething'], ctx];
-    let d3 = (el) => refs[\`myButton\`] = el;
-    return block2([hdlr2, d3]);
+    let hdlr1 = [ctx['doSomething'], ctx];
+    let d1 = (el) => refs[\`myButton\`] = el;
+    return block2([hdlr1, d1]);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let txt1 = ctx['state'].val;
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'footer': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'footer': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([txt1], [b3]);
   }
 }"
diff --git a/tests/components/__snapshots__/slots.test.ts.snap b/tests/components/__snapshots__/slots.test.ts.snap
index ab978f1a..76373293 100644
--- a/tests/components/__snapshots__/slots.test.ts.snap
+++ b/tests/components/__snapshots__/slots.test.ts.snap
@@ -43,17 +43,17 @@ exports[`slots can define and call slots 1`] = `
   let block2 = createBlock(\`<span>header</span>\`);
   let block3 = createBlock(\`<span>footer</span>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return block2();
   }
   
-  function slot3(ctx, node, key = \\"\\") {
+  function slot2(ctx, node, key = \\"\\") {
     return block3();
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b4 = component(\`Dialog\`, {slots: {'header': {__render: slot2, __ctx: ctx1}, 'footer': {__render: slot3, __ctx: ctx1}}}, key + \`__4\`, node, ctx);
+    let b4 = component(\`Dialog\`, {slots: {'header': {__render: slot1, __ctx: ctx1}, 'footer': {__render: slot2, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b4]);
   }
 }"
@@ -85,17 +85,17 @@ exports[`slots can define and call slots with params 1`] = `
   let block2 = createBlock(\`<span>header</span>\`);
   let block3 = createBlock(\`<span>footer</span>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return block2();
   }
   
-  function slot3(ctx, node, key = \\"\\") {
+  function slot2(ctx, node, key = \\"\\") {
     return block3();
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b4 = component(\`Dialog\`, {slots: {'header': {__render: slot2, __ctx: ctx1, param: ctx['var']}, 'footer': {__render: slot3, __ctx: ctx1, param: '5'}}}, key + \`__4\`, node, ctx);
+    let b4 = component(\`Dialog\`, {slots: {'header': {__render: slot1, __ctx: ctx1, param: ctx['var']}, 'footer': {__render: slot2, __ctx: ctx1, param: '5'}}}, key + \`__1\`, node, ctx);
     return block1([], [b4]);
   }
 }"
@@ -130,12 +130,12 @@ exports[`slots can render node with t-ref and Component in same slot 1`] = `
     const refs = ctx.__owl__.refs;
     let d1 = (el) => refs[\`div\`] = el;
     let b2 = block2([d1]);
-    let b3 = component(\`Child\`, {}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
     return multi([b2, b3]);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
   }
 }"
 `;
@@ -182,7 +182,7 @@ exports[`slots can use component in default-content of t-slot 2`] = `
   let { callSlot } = helpers;
   
   function defaultContent1(ctx, node, key = \\"\\") {
-    return component(\`GrandChild\`, {}, key + \`__2\`, node, ctx);
+    return component(\`GrandChild\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
@@ -218,10 +218,10 @@ exports[`slots can use t-call in default-content of t-slot 2`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { callSlot, getTemplate } = helpers;
-  const callTemplate_3 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   function defaultContent1(ctx, node, key = \\"\\") {
-    return callTemplate_3.call(this, ctx, node, key + \`__2\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
   
   return function template(ctx, node, key = \\"\\") {
@@ -253,7 +253,7 @@ exports[`slots content is the default slot (variation) 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -283,7 +283,7 @@ exports[`slots content is the default slot 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -312,13 +312,13 @@ exports[`slots default content is not rendered if named slot is provided 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return text(\`hey\`);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'header': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'header': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -355,7 +355,7 @@ exports[`slots default content is not rendered if slot is provided 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -388,13 +388,13 @@ exports[`slots default slot next to named slot, with default content 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return text(\` Overridden footer \`);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'footer': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'footer': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -434,7 +434,7 @@ exports[`slots default slot work with text nodes (variation) 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -463,7 +463,7 @@ exports[`slots default slot work with text nodes 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -495,19 +495,19 @@ exports[`slots dynamic t-slot call 1`] = `
   let block4 = createBlock(\`<span>content</span>\`);
   let block5 = createBlock(\`<h1>slot2</h1>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let b3 = block3();
     let b4 = block4();
     return multi([b3, b4]);
   }
   
-  function slot3(ctx, node, key = \\"\\") {
+  function slot2(ctx, node, key = \\"\\") {
     return block5();
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b6 = component(\`Toggler\`, {slots: {'slot1': {__render: slot2, __ctx: ctx1}, 'slot2': {__render: slot3, __ctx: ctx1}}}, key + \`__4\`, node, ctx);
+    let b6 = component(\`Toggler\`, {slots: {'slot1': {__render: slot1, __ctx: ctx1}, 'slot2': {__render: slot2, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b6]);
   }
 }"
@@ -541,19 +541,19 @@ exports[`slots dynamic t-slot call with default 1`] = `
   let block4 = createBlock(\`<span>content</span>\`);
   let block5 = createBlock(\`<h1>slot2</h1>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let b3 = block3();
     let b4 = block4();
     return multi([b3, b4]);
   }
   
-  function slot3(ctx, node, key = \\"\\") {
+  function slot2(ctx, node, key = \\"\\") {
     return block5();
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b6 = component(\`Toggler\`, {slots: {'slot1': {__render: slot2, __ctx: ctx1}, 'slot2': {__render: slot3, __ctx: ctx1}}}, key + \`__4\`, node, ctx);
+    let b6 = component(\`Toggler\`, {slots: {'slot1': {__render: slot1, __ctx: ctx1}, 'slot2': {__render: slot2, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b6]);
   }
 }"
@@ -589,7 +589,7 @@ exports[`slots fun: two calls to the same slot 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -654,7 +654,7 @@ exports[`slots multiple roots are allowed in a default slot 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b5 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b5 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -685,7 +685,7 @@ exports[`slots multiple roots are allowed in a named slot 1`] = `
   let block3 = createBlock(\`<span>sts</span>\`);
   let block4 = createBlock(\`<span>rocks</span>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let b3 = block3();
     let b4 = block4();
     return multi([b3, b4]);
@@ -693,7 +693,7 @@ exports[`slots multiple roots are allowed in a named slot 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b5 = component(\`Dialog\`, {slots: {'content': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b5 = component(\`Dialog\`, {slots: {'content': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -720,17 +720,17 @@ exports[`slots multiple slots containing components 1`] = `
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { capture } = helpers;
   
-  function slot2(ctx, node, key = \\"\\") {
-    return component(\`C\`, {val: 1}, key + \`__3\`, node, ctx);
+  function slot1(ctx, node, key = \\"\\") {
+    return component(\`C\`, {val: 1}, key + \`__1\`, node, ctx);
   }
   
-  function slot4(ctx, node, key = \\"\\") {
-    return component(\`C\`, {val: 2}, key + \`__5\`, node, ctx);
+  function slot2(ctx, node, key = \\"\\") {
+    return component(\`C\`, {val: 2}, key + \`__2\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    return component(\`B\`, {slots: {'s1': {__render: slot2, __ctx: ctx1}, 's2': {__render: slot4, __ctx: ctx1}}}, key + \`__6\`, node, ctx);
+    return component(\`B\`, {slots: {'s1': {__render: slot1, __ctx: ctx1}, 's2': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
   }
 }"
 `;
@@ -775,24 +775,24 @@ exports[`slots named slot inside slot 1`] = `
   let block2 = createBlock(\`<p>A<block-text-0/></p>\`);
   let block3 = createBlock(\`<p>B<block-text-0/></p>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let txt1 = ctx['value'];
     return block2([txt1]);
   }
   
-  function slot3(ctx, node, key = \\"\\") {
-    const ctx4 = capture(ctx);
-    return component(\`Child\`, {slots: {'brol': {__render: slot5, __ctx: ctx4}}}, key + \`__6\`, node, ctx);
+  function slot2(ctx, node, key = \\"\\") {
+    const ctx2 = capture(ctx);
+    return component(\`Child\`, {slots: {'brol': {__render: slot3, __ctx: ctx2}}}, key + \`__1\`, node, ctx);
   }
   
-  function slot5(ctx, node, key = \\"\\") {
+  function slot3(ctx, node, key = \\"\\") {
     let txt2 = ctx['value'];
     return block3([txt2]);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b5 = component(\`Child\`, {slots: {'brol': {__render: slot2, __ctx: ctx1}, 'default': {__render: slot3, __ctx: ctx1}}}, key + \`__7\`, node, ctx);
+    let b5 = component(\`Child\`, {slots: {'brol': {__render: slot1, __ctx: ctx1}, 'default': {__render: slot2, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -824,24 +824,24 @@ exports[`slots named slot inside slot, part 3 1`] = `
   let block2 = createBlock(\`<p>A<block-text-0/></p>\`);
   let block3 = createBlock(\`<p>B<block-text-0/></p>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let txt1 = ctx['value'];
     return block2([txt1]);
   }
   
-  function slot3(ctx, node, key = \\"\\") {
-    const ctx4 = capture(ctx);
-    return component(\`Child\`, {slots: {'brol': {__render: slot5, __ctx: ctx4}}}, key + \`__6\`, node, ctx);
+  function slot2(ctx, node, key = \\"\\") {
+    const ctx2 = capture(ctx);
+    return component(\`Child\`, {slots: {'brol': {__render: slot3, __ctx: ctx2}}}, key + \`__1\`, node, ctx);
   }
   
-  function slot5(ctx, node, key = \\"\\") {
+  function slot3(ctx, node, key = \\"\\") {
     let txt2 = ctx['value'];
     return block3([txt2]);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b5 = component(\`Child\`, {slots: {'brol': {__render: slot2, __ctx: ctx1}, 'default': {__render: slot3, __ctx: ctx1}}}, key + \`__7\`, node, ctx);
+    let b5 = component(\`Child\`, {slots: {'brol': {__render: slot1, __ctx: ctx1}, 'default': {__render: slot2, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -906,24 +906,24 @@ exports[`slots named slots inside slot, again 1`] = `
   let block2 = createBlock(\`<p>A<block-text-0/></p>\`);
   let block3 = createBlock(\`<p>B<block-text-0/></p>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let txt1 = ctx['value'];
     return block2([txt1]);
   }
   
-  function slot3(ctx, node, key = \\"\\") {
-    const ctx4 = capture(ctx);
-    return component(\`Child\`, {slots: {'brol2': {__render: slot5, __ctx: ctx4}}}, key + \`__6\`, node, ctx);
+  function slot2(ctx, node, key = \\"\\") {
+    const ctx2 = capture(ctx);
+    return component(\`Child\`, {slots: {'brol2': {__render: slot3, __ctx: ctx2}}}, key + \`__1\`, node, ctx);
   }
   
-  function slot5(ctx, node, key = \\"\\") {
+  function slot3(ctx, node, key = \\"\\") {
     let txt2 = ctx['value'];
     return block3([txt2]);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b5 = component(\`Child\`, {slots: {'brol1': {__render: slot2, __ctx: ctx1}, 'default': {__render: slot3, __ctx: ctx1}}}, key + \`__7\`, node, ctx);
+    let b5 = component(\`Child\`, {slots: {'brol1': {__render: slot1, __ctx: ctx1}, 'default': {__render: slot2, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -962,15 +962,15 @@ exports[`slots nested slots in same template 1`] = `
   let block1 = createBlock(\`<span id=\\"parent\\"><block-child-0/></span>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child2\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__4\`, node, ctx);
+    return component(\`Child2\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__2\`, node, ctx);
   }
   
   function slot2(ctx, node, key = \\"\\") {
-    return component(\`Child3\`, {}, key + \`__3\`, node, ctx);
+    return component(\`Child3\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b4 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__5\`, node, ctx);
+    let b4 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
     return block1([], [b4]);
   }
 }"
@@ -1025,11 +1025,11 @@ exports[`slots nested slots: evaluation context and parented relationship 1`] =
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Slot\`, {val: ctx['state'].val}, key + \`__2\`, node, ctx);
+    return component(\`Slot\`, {val: ctx['state'].val}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
   }
 }"
 `;
@@ -1045,7 +1045,7 @@ exports[`slots nested slots: evaluation context and parented relationship 2`] =
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`GrandChild\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`GrandChild\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1115,7 +1115,7 @@ exports[`slots simple default slot 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1141,7 +1141,7 @@ exports[`slots simple default slot with params 1`] = `
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { capture } = helpers;
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let b2,b3;
     if (ctx['slotScope'].bool) {
       b2 = text(\`some text\`);
@@ -1153,7 +1153,7 @@ exports[`slots simple default slot with params 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    return component(\`Child\`, {slots: {'default': {__render: slot2, __ctx: ctx1, __scope: \\"slotScope\\"}}}, key + \`__3\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx1, __scope: \\"slotScope\\"}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1189,7 +1189,7 @@ exports[`slots simple default slot with params 3`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1219,7 +1219,7 @@ exports[`slots simple default slot, variation 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1241,17 +1241,17 @@ exports[`slots slot and (inline) t-call 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { capture, getTemplate } = helpers;
-  const callTemplate_4 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
-    return callTemplate_4.call(this, ctx, node, key + \`__3\`);
+  function slot1(ctx, node, key = \\"\\") {
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__5\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1290,17 +1290,17 @@ exports[`slots slot and t-call 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { capture, getTemplate } = helpers;
-  const callTemplate_4 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
-    return callTemplate_4.call(this, ctx, node, key + \`__3\`);
+  function slot1(ctx, node, key = \\"\\") {
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__5\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1346,7 +1346,7 @@ exports[`slots slot and t-esc 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1375,14 +1375,14 @@ exports[`slots slot are properly rendered if inner props are changed 1`] = `
   let block1 = createBlock(\`<div><button block-handler-0=\\"click\\">Inc[<block-text-1/>]</button><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`SomeComponent\`, {val: ctx['state'].val}, key + \`__2\`, node, ctx);
+    return component(\`SomeComponent\`, {val: ctx['state'].val}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let hdlr1 = [ctx['inc'], ctx];
-    let txt2 = ctx['state'].val;
-    let b3 = component(\`GenericComponent\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
-    return block1([hdlr1, txt2], [b3]);
+    let txt1 = ctx['state'].val;
+    let b3 = component(\`GenericComponent\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return block1([hdlr1, txt1], [b3]);
   }
 }"
 `;
@@ -1424,7 +1424,7 @@ exports[`slots slot content is bound to caller (variation) 1`] = `
   
   let block1 = createBlock(\`<button block-handler-0=\\"click\\">some text</button>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"var\\", 1);
@@ -1434,7 +1434,7 @@ exports[`slots slot content is bound to caller (variation) 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    return component(\`Child\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1467,7 +1467,7 @@ exports[`slots slot content is bound to caller 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1495,11 +1495,11 @@ exports[`slots slot preserves properly parented relationship 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`GrandChild\`, {}, key + \`__2\`, node, ctx);
+    return component(\`GrandChild\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1533,17 +1533,17 @@ exports[`slots slot preserves properly parented relationship, even through t-cal
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { capture, getTemplate } = helpers;
-  const callTemplate_4 = getTemplate(\`sub\`);
+  const callTemplate_1 = getTemplate(\`sub\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
-    return callTemplate_4.call(this, ctx, node, key + \`__3\`);
+  function slot1(ctx, node, key = \\"\\") {
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Child\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__5\`, node, ctx);
+    let b3 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1593,7 +1593,7 @@ exports[`slots slots and wrapper components 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Link\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Link\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -1637,8 +1637,8 @@ exports[`slots slots are properly bound to correct component 2`] = `
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"var\\", 1);
     let hdlr1 = [()=>this.increment(), ctx];
-    let txt2 = ctx['state'].value;
-    return block1([hdlr1, txt2]);
+    let txt1 = ctx['state'].value;
+    return block1([hdlr1, txt1]);
   }
   
   return function template(ctx, node, key = \\"\\") {
@@ -1656,15 +1656,15 @@ exports[`slots slots are rendered with proper context 1`] = `
   let block1 = createBlock(\`<div><span class=\\"counter\\"><block-text-0/></span><block-child-0/></div>\`);
   let block2 = createBlock(\`<button block-handler-0=\\"click\\">do something</button>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
-    let hdlr2 = [ctx['doSomething'], ctx];
-    return block2([hdlr2]);
+  function slot1(ctx, node, key = \\"\\") {
+    let hdlr1 = [ctx['doSomething'], ctx];
+    return block2([hdlr1]);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let txt1 = ctx['state'].val;
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'footer': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'footer': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([txt1], [b3]);
   }
 }"
@@ -1694,7 +1694,7 @@ exports[`slots slots are rendered with proper context, part 2 1`] = `
   let block1 = createBlock(\`<div><u><block-child-0/></u></div>\`);
   let block3 = createBlock(\`<li><block-child-0/></li>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let b5 = text(\`User \`);
     let b6 = text(ctx['user'].name);
     return multi([b5, b6]);
@@ -1707,7 +1707,7 @@ exports[`slots slots are rendered with proper context, part 2 1`] = `
       ctx[\`user\`] = v_block2[i1];
       let key1 = ctx['user'].id;
       const ctx1 = capture(ctx);
-      let b7 = component(\`Link\`, {to: '/user/'+ctx['user'].id,slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3__\${key1}\`, node, ctx);
+      let b7 = component(\`Link\`, {to: '/user/'+ctx['user'].id,slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1__\${key1}\`, node, ctx);
       c_block2[i1] = withKey(block3([], [b7]), key1);
     }
     let b2 = list(c_block2);
@@ -1741,7 +1741,7 @@ exports[`slots slots are rendered with proper context, part 3 1`] = `
   let block1 = createBlock(\`<div><u><block-child-0/></u></div>\`);
   let block3 = createBlock(\`<li><block-child-0/></li>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return text(ctx['userdescr']);
   }
   
@@ -1755,7 +1755,7 @@ exports[`slots slots are rendered with proper context, part 3 1`] = `
       let key1 = ctx['user'].id;
       setContextValue(ctx, \\"userdescr\\", 'User '+ctx['user'].name);
       const ctx1 = capture(ctx);
-      let b5 = component(\`Link\`, {to: '/user/'+ctx['user'].id,slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3__\${key1}\`, node, ctx);
+      let b5 = component(\`Link\`, {to: '/user/'+ctx['user'].id,slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1__\${key1}\`, node, ctx);
       c_block2[i1] = withKey(block3([], [b5]), key1);
     }
     let b2 = list(c_block2);
@@ -1788,7 +1788,7 @@ exports[`slots slots are rendered with proper context, part 4 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return text(ctx['userdescr']);
   }
   
@@ -1797,7 +1797,7 @@ exports[`slots slots are rendered with proper context, part 4 1`] = `
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"userdescr\\", 'User '+ctx['state'].user.name);
     const ctx1 = capture(ctx);
-    let b3 = component(\`Link\`, {to: '/user/'+ctx['state'].user.id,slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Link\`, {to: '/user/'+ctx['state'].user.id,slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1828,7 +1828,7 @@ exports[`slots slots in slots, with vars 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   let block2 = createBlock(\`<p>hey<block-text-0/></p>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let txt1 = ctx['test'];
     return block2([txt1]);
   }
@@ -1838,7 +1838,7 @@ exports[`slots slots in slots, with vars 1`] = `
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"test\\", ctx['state'].name);
     const ctx1 = capture(ctx);
-    let b3 = component(\`A\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`A\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1857,7 +1857,7 @@ exports[`slots slots in slots, with vars 2`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`B\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`B\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -1886,7 +1886,7 @@ exports[`slots slots in t-foreach and re-rendering 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return text(ctx['n_index']);
   }
   
@@ -1898,7 +1898,7 @@ exports[`slots slots in t-foreach and re-rendering 1`] = `
       ctx[\`n_index\`] = i1;
       let key1 = ctx['n_index'];
       const ctx1 = capture(ctx);
-      c_block2[i1] = withKey(component(\`Child\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3__\${key1}\`, node, ctx), key1);
+      c_block2[i1] = withKey(component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1__\${key1}\`, node, ctx), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -1933,7 +1933,7 @@ exports[`slots slots in t-foreach in t-foreach 1`] = `
   let block5 = createBlock(\`<ul><block-child-0/></ul>\`);
   let block7 = createBlock(\`<li><block-text-0/></li>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     let txt2 = ctx['node1'].value;
     return block7([txt2]);
   }
@@ -1952,7 +1952,7 @@ exports[`slots slots in t-foreach in t-foreach 1`] = `
         ctx[\`node2\`] = v_block6[i2];
         let key2 = ctx['node2'].key;
         const ctx1 = capture(ctx);
-        c_block6[i2] = withKey(component(\`Child\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3__\${key1}__\${key2}\`, node, ctx), key2);
+        c_block6[i2] = withKey(component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1__\${key1}__\${key2}\`, node, ctx), key2);
       }
       ctx = ctx.__proto__;
       let b6 = list(c_block6);
@@ -1988,7 +1988,7 @@ exports[`slots slots in t-foreach with t-set and re-rendering 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     return text(ctx['dummy']);
   }
   
@@ -2003,7 +2003,7 @@ exports[`slots slots in t-foreach with t-set and re-rendering 1`] = `
       let key1 = ctx['n_index'];
       setContextValue(ctx, \\"dummy\\", ctx['n_index']);
       const ctx1 = capture(ctx);
-      c_block2[i1] = withKey(component(\`Child\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3__\${key1}\`, node, ctx), key1);
+      c_block2[i1] = withKey(component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1__\${key1}\`, node, ctx), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -2035,14 +2035,14 @@ exports[`slots t-debug on a t-set-slot (defining a slot) 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     debugger;
     return text(\`abc\`);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'content': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'content': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -2071,7 +2071,7 @@ exports[`slots t-set t-value in a slot 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"rainbow\\", 'dash');
@@ -2080,7 +2080,7 @@ exports[`slots t-set t-value in a slot 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -2106,9 +2106,9 @@ exports[`slots t-slot in recursive templates 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { capture, prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
-  const callTemplate_4 = getTemplate(\`_test_recursive_template\`);
+  const callTemplate_1 = getTemplate(\`_test_recursive_template\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
     let b2 = text(ctx['name']);
@@ -2129,7 +2129,7 @@ exports[`slots t-slot in recursive templates 1`] = `
         ctx[isBoundary] = 1;
         setContextValue(ctx, \\"name\\", ctx['item'].name);
         setContextValue(ctx, \\"items\\", ctx['item'].children);
-        b6 = callTemplate_4.call(this, ctx, node, key + \`__3__\${key1}\`);
+        b6 = callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`);
         ctx = ctx.__proto__;
       }
       c_block3[i1] = withKey(multi([b5, b6]), key1);
@@ -2141,7 +2141,7 @@ exports[`slots t-slot in recursive templates 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    return component(\`Wrapper\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__5\`, node, ctx);
+    return component(\`Wrapper\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
   }
 }"
 `;
@@ -2169,11 +2169,11 @@ exports[`slots t-slot nested within another slot 1`] = `
   let block1 = createBlock(\`<span id=\\"c1\\"><block-child-0/></span>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child3\`, {}, key + \`__2\`, node, ctx);
+    return component(\`Child3\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -2188,7 +2188,7 @@ exports[`slots t-slot nested within another slot 2`] = `
   let block1 = createBlock(\`<span id=\\"c2\\"><block-child-0/></span>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Portal\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    return component(\`Portal\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
   
   function slot2(ctx, node, key = \\"\\") {
@@ -2196,7 +2196,7 @@ exports[`slots t-slot nested within another slot 2`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b4 = component(\`Modal\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__4\`, node, ctx);
+    let b4 = component(\`Modal\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b4]);
   }
 }"
@@ -2257,7 +2257,7 @@ exports[`slots t-slot scope context 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Dialog\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -2277,7 +2277,7 @@ exports[`slots t-slot scope context 2`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Wrapper\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Wrapper\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -2302,14 +2302,14 @@ exports[`slots t-slot within dynamic t-call 1`] = `
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
-    const template4 = (ctx['tcallTemplate']);
-    return call(this, template4, ctx, node, key + \`__3\`);
+  function slot1(ctx, node, key = \\"\\") {
+    const template1 = (ctx['tcallTemplate']);
+    return call(this, template1, ctx, node, key + \`__1\`);
   }
   
   return function template(ctx, node, key = \\"\\") {
     const ctx1 = capture(ctx);
-    let b3 = component(\`Slotted\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__5\`, node, ctx);
+    let b3 = component(\`Slotted\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -2365,11 +2365,11 @@ exports[`slots template can just return a slot 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {value: ctx['state'].value}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {value: ctx['state'].value}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`SlotComponent\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`SlotComponent\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
diff --git a/tests/components/__snapshots__/style_class.test.ts.snap b/tests/components/__snapshots__/style_class.test.ts.snap
index 9a15af73..38743fe1 100644
--- a/tests/components/__snapshots__/style_class.test.ts.snap
+++ b/tests/components/__snapshots__/style_class.test.ts.snap
@@ -350,8 +350,8 @@ exports[`style and class handling error in subcomponent with class 2`] = `
   
   return function template(ctx, node, key = \\"\\") {
     let attr1 = ctx['props'].class;
-    let txt2 = this.will.crash;
-    return block1([attr1, txt2]);
+    let txt1 = this.will.crash;
+    return block1([attr1, txt1]);
   }
 }"
 `;
diff --git a/tests/components/__snapshots__/t_call.test.ts.snap b/tests/components/__snapshots__/t_call.test.ts.snap
index 9226e902..34830b7a 100644
--- a/tests/components/__snapshots__/t_call.test.ts.snap
+++ b/tests/components/__snapshots__/t_call.test.ts.snap
@@ -11,8 +11,8 @@ exports[`t-call dynamic t-call 1`] = `
     ctx[isBoundary] = 1;
     let b1 = text(\` owl \`);
     ctx[zero] = b1;
-    const template2 = (ctx['current'].template);
-    return call(this, template2, ctx, node, key + \`__1\`);
+    const template1 = (ctx['current'].template);
+    return call(this, template1, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -50,8 +50,8 @@ exports[`t-call handlers are properly bound through a dynamic t-call 1`] = `
   let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    const template2 = ('__template__999');
-    let b2 = call(this, template2, ctx, node, key + \`__1\`);
+    const template1 = ('__template__999');
+    let b2 = call(this, template1, ctx, node, key + \`__1\`);
     let txt1 = ctx['counter'];
     return block1([txt1], [b2]);
   }
@@ -77,12 +77,12 @@ exports[`t-call handlers are properly bound through a t-call 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     let txt1 = ctx['counter'];
     return block1([txt1], [b2]);
   }
@@ -108,12 +108,12 @@ exports[`t-call handlers with arguments are properly bound through a t-call 1`]
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -139,12 +139,12 @@ exports[`t-call parent is set within t-call 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -179,10 +179,10 @@ exports[`t-call parent is set within t-call with no parentNode 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   return function template(ctx, node, key = \\"\\") {
-    return callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    return callTemplate_1.call(this, ctx, node, key + \`__1\`);
   }
 }"
 `;
@@ -216,17 +216,17 @@ exports[`t-call sub components in two t-calls 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
+  const callTemplate_1 = getTemplate(\`sub\`);
   const callTemplate_2 = getTemplate(\`sub\`);
-  const callTemplate_4 = getTemplate(\`sub\`);
   
   let block3 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
     let b2,b3;
     if (ctx['state'].val===1) {
-      b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+      b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     } else {
-      let b4 = callTemplate_4.call(this, ctx, node, key + \`__3\`);
+      let b4 = callTemplate_2.call(this, ctx, node, key + \`__2\`);
       b3 = block3([], [b4]);
     }
     return multi([b2, b3]);
@@ -264,7 +264,7 @@ exports[`t-call t-call in t-foreach and children component 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { prepareList, getTemplate, withKey } = helpers;
-  const callTemplate_2 = getTemplate(\`__template__999\`);
+  const callTemplate_1 = getTemplate(\`__template__999\`);
   
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
@@ -278,7 +278,7 @@ exports[`t-call t-call in t-foreach and children component 1`] = `
       ctx[\`val_index\`] = i1;
       ctx[\`val_value\`] = k_block2[i1];
       let key1 = ctx['val'];
-      c_block2[i1] = withKey(callTemplate_2.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
+      c_block2[i1] = withKey(callTemplate_1.call(this, ctx, node, key + \`__1__\${key1}\`), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
diff --git a/tests/components/__snapshots__/t_component.test.ts.snap b/tests/components/__snapshots__/t_component.test.ts.snap
index e253dce0..a1cc1155 100644
--- a/tests/components/__snapshots__/t_component.test.ts.snap
+++ b/tests/components/__snapshots__/t_component.test.ts.snap
@@ -8,8 +8,8 @@ exports[`t-component can switch between dynamic components without the need for
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let Comp2 = ctx['constructor'].components[ctx['state'].child];
-    let b2 = toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
+    let Comp1 = ctx['constructor'].components[ctx['state'].child];
+    let b2 = toggler(Comp1, component(Comp1, {}, key + \`__1\`, node, ctx));
     return block1([], [b2]);
   }
 }"
@@ -48,8 +48,8 @@ exports[`t-component can use dynamic components (the class) if given (with diffe
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['state'].child;
-    let Comp3 = ctx['myComponent'];
-    return toggler(tKey_1, toggler(Comp3, component(Comp3, {}, tKey_1 + key + \`__2\`, node, ctx)));
+    let Comp1 = ctx['myComponent'];
+    return toggler(tKey_1, toggler(Comp1, component(Comp1, {}, tKey_1 + key + \`__1\`, node, ctx)));
   }
 }"
 `;
@@ -87,8 +87,8 @@ exports[`t-component can use dynamic components (the class) if given 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['state'].child;
-    let Comp3 = ctx['myComponent'];
-    return toggler(tKey_1, toggler(Comp3, component(Comp3, {}, tKey_1 + key + \`__2\`, node, ctx)));
+    let Comp1 = ctx['myComponent'];
+    return toggler(tKey_1, toggler(Comp1, component(Comp1, {}, tKey_1 + key + \`__1\`, node, ctx)));
   }
 }"
 `;
@@ -127,8 +127,8 @@ exports[`t-component modifying a sub widget 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let Comp2 = ctx['Counter'];
-    let b2 = toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
+    let Comp1 = ctx['Counter'];
+    let b2 = toggler(Comp1, component(Comp1, {}, key + \`__1\`, node, ctx));
     return block1([], [b2]);
   }
 }"
@@ -144,8 +144,8 @@ exports[`t-component modifying a sub widget 2`] = `
   return function template(ctx, node, key = \\"\\") {
     let txt1 = ctx['state'].counter;
     const v1 = ctx['state'];
-    let hdlr2 = [()=>v1.counter++, ctx];
-    return block1([txt1, hdlr2]);
+    let hdlr1 = [()=>v1.counter++, ctx];
+    return block1([txt1, hdlr1]);
   }
 }"
 `;
@@ -156,8 +156,8 @@ exports[`t-component switching dynamic component 1`] = `
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
   return function template(ctx, node, key = \\"\\") {
-    let Comp2 = ctx['Child'];
-    return toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
+    let Comp1 = ctx['Child'];
+    return toggler(Comp1, component(Comp1, {}, key + \`__1\`, node, ctx));
   }
 }"
 `;
@@ -192,8 +192,8 @@ exports[`t-component t-component works in simple case 1`] = `
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
   return function template(ctx, node, key = \\"\\") {
-    let Comp2 = ctx['Child'];
-    return toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
+    let Comp1 = ctx['Child'];
+    return toggler(Comp1, component(Comp1, {}, key + \`__1\`, node, ctx));
   }
 }"
 `;
diff --git a/tests/components/__snapshots__/t_foreach.test.ts.snap b/tests/components/__snapshots__/t_foreach.test.ts.snap
index 204c2b1f..b97a1d5d 100644
--- a/tests/components/__snapshots__/t_foreach.test.ts.snap
+++ b/tests/components/__snapshots__/t_foreach.test.ts.snap
@@ -55,7 +55,7 @@ exports[`list of components crash on duplicate key in dev mode 1`] = `
       keys1.add(key1);
       const props1 = {}
       helpers.validateProps(\`Child\`, props1, ctx)
-      c_block1[i1] = withKey(component(\`Child\`, props1, key + \`__2__\${key1}\`, node, ctx), key1);
+      c_block1[i1] = withKey(component(\`Child\`, props1, key + \`__1__\${key1}\`, node, ctx), key1);
     }
     return list(c_block1);
   }
diff --git a/tests/components/__snapshots__/t_key.test.ts.snap b/tests/components/__snapshots__/t_key.test.ts.snap
index 3bebc15a..990a85cf 100644
--- a/tests/components/__snapshots__/t_key.test.ts.snap
+++ b/tests/components/__snapshots__/t_key.test.ts.snap
@@ -15,7 +15,7 @@ exports[`t-key t-foreach with t-key switch component position 1`] = `
       ctx[\`c\`] = v_block2[i1];
       let key1 = ctx['c'];
       const tKey_1 = ctx['key1'];
-      c_block2[i1] = withKey(component(\`Child\`, {key: ctx['c']+ctx['key1']}, tKey_1 + key + \`__2__\${key1}\`, node, ctx), tKey_1 + key1);
+      c_block2[i1] = withKey(component(\`Child\`, {key: ctx['c']+ctx['key1']}, tKey_1 + key + \`__1__\${key1}\`, node, ctx), tKey_1 + key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -44,7 +44,7 @@ exports[`t-key t-key on Component 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['key'];
-    return toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__2\`, node, ctx));
+    return toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__1\`, node, ctx));
   }
 }"
 `;
@@ -72,7 +72,7 @@ exports[`t-key t-key on Component as a function 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['key'];
-    let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__2\`, node, ctx));
+    let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__1\`, node, ctx));
     return block1([], [b2]);
   }
 }"
@@ -101,9 +101,9 @@ exports[`t-key t-key on multiple Components 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['key1'];
-    let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key1']}, tKey_1 + key + \`__2\`, node, ctx));
-    const tKey_3 = ctx['key2'];
-    let b3 = toggler(tKey_3, component(\`Child\`, {key: ctx['key2']}, tKey_3 + key + \`__4\`, node, ctx));
+    let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key1']}, tKey_1 + key + \`__1\`, node, ctx));
+    const tKey_2 = ctx['key2'];
+    let b3 = toggler(tKey_2, component(\`Child\`, {key: ctx['key2']}, tKey_2 + key + \`__2\`, node, ctx));
     return block1([], [b2, b3]);
   }
 }"
@@ -128,8 +128,8 @@ exports[`t-key t-key on multiple Components with t-call 1 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
+  const callTemplate_1 = getTemplate(\`calledTemplate\`);
   const callTemplate_2 = getTemplate(\`calledTemplate\`);
-  const callTemplate_4 = getTemplate(\`calledTemplate\`);
   
   let block1 = createBlock(\`<span><block-child-0/><block-child-1/></span>\`);
   
@@ -139,12 +139,12 @@ exports[`t-key t-key on multiple Components with t-call 1 1`] = `
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"key\\", ctx['key1']);
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     ctx = ctx.__proto__;
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1;
     setContextValue(ctx, \\"key\\", ctx['key2']);
-    let b3 = callTemplate_4.call(this, ctx, node, key + \`__3\`);
+    let b3 = callTemplate_2.call(this, ctx, node, key + \`__2\`);
     return block1([], [b2, b3]);
   }
 }"
@@ -157,7 +157,7 @@ exports[`t-key t-key on multiple Components with t-call 1 2`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['key'];
-    return toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__2\`, node, ctx));
+    return toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__1\`, node, ctx));
   }
 }"
 `;
@@ -181,12 +181,12 @@ exports[`t-key t-key on multiple Components with t-call 2 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_2 = getTemplate(\`calledTemplate\`);
+  const callTemplate_1 = getTemplate(\`calledTemplate\`);
   
   let block1 = createBlock(\`<span><block-child-0/></span>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
+    let b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
     return block1([], [b2]);
   }
 }"
@@ -199,9 +199,9 @@ exports[`t-key t-key on multiple Components with t-call 2 2`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['key1'];
-    let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key1']}, tKey_1 + key + \`__2\`, node, ctx));
-    const tKey_3 = ctx['key2'];
-    let b3 = toggler(tKey_3, component(\`Child\`, {key: ctx['key2']}, tKey_3 + key + \`__4\`, node, ctx));
+    let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key1']}, tKey_1 + key + \`__1\`, node, ctx));
+    const tKey_2 = ctx['key2'];
+    let b3 = toggler(tKey_2, component(\`Child\`, {key: ctx['key2']}, tKey_2 + key + \`__2\`, node, ctx));
     return multi([b2, b3]);
   }
 }"
diff --git a/tests/components/__snapshots__/t_model.test.ts.snap b/tests/components/__snapshots__/t_model.test.ts.snap
index d56a5a75..0532c519 100644
--- a/tests/components/__snapshots__/t_model.test.ts.snap
+++ b/tests/components/__snapshots__/t_model.test.ts.snap
@@ -11,9 +11,9 @@ exports[`t-model directive .lazy modifier 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    let txt3 = ctx['state'].text;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    let txt1 = ctx['state'].text;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -29,9 +29,9 @@ exports[`t-model directive .number modifier 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['number'];
-    let hdlr2 = [(ev) => { bExpr1['number'] = toNumber(ev.target.value); }];
-    let txt3 = ctx['state'].number;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['number'] = toNumber(ev.target.value); }];
+    let txt1 = ctx['state'].number;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -47,9 +47,9 @@ exports[`t-model directive .trim modifier 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value.trim(); }];
-    let txt3 = ctx['state'].text;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value.trim(); }];
+    let txt1 = ctx['state'].text;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -65,9 +65,9 @@ exports[`t-model directive basic use, on an input 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    let txt3 = ctx['state'].text;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    let txt1 = ctx['state'].text;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -83,9 +83,9 @@ exports[`t-model directive basic use, on an input with bracket expression 1`] =
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    let txt3 = ctx['state'].text;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    let txt1 = ctx['state'].text;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -101,9 +101,9 @@ exports[`t-model directive basic use, on another key in component 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['some'];
     let attr1 = ctx['some']['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    let txt3 = ctx['some'].text;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    let txt1 = ctx['some'].text;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -119,9 +119,9 @@ exports[`t-model directive can also define t-on directive on same event, part 1
   return function template(ctx, node, key = \\"\\") {
     let hdlr1 = [ctx['onInput'], ctx];
     const bExpr1 = ctx['state'];
-    let attr2 = ctx['state']['text'];
-    let hdlr3 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    return block1([hdlr1, attr2, hdlr3]);
+    let attr1 = ctx['state']['text'];
+    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    return block1([hdlr1, attr1, hdlr2]);
   }
 }"
 `;
@@ -137,17 +137,17 @@ exports[`t-model directive can also define t-on directive on same event, part 2
   return function template(ctx, node, key = \\"\\") {
     let hdlr1 = [ctx['onClick'], ctx];
     const bExpr1 = ctx['state'];
-    let attr2 = ctx['state']['choice'] === 'One';
-    let hdlr3 = [(ev) => { bExpr1['choice'] = ev.target.value; }];
-    let hdlr4 = [ctx['onClick'], ctx];
+    let attr1 = ctx['state']['choice'] === 'One';
+    let hdlr2 = [(ev) => { bExpr1['choice'] = ev.target.value; }];
+    let hdlr3 = [ctx['onClick'], ctx];
     const bExpr2 = ctx['state'];
-    let attr5 = ctx['state']['choice'] === 'Two';
-    let hdlr6 = [(ev) => { bExpr2['choice'] = ev.target.value; }];
-    let hdlr7 = [ctx['onClick'], ctx];
+    let attr2 = ctx['state']['choice'] === 'Two';
+    let hdlr4 = [(ev) => { bExpr2['choice'] = ev.target.value; }];
+    let hdlr5 = [ctx['onClick'], ctx];
     const bExpr3 = ctx['state'];
-    let attr8 = ctx['state']['choice'] === 'Three';
-    let hdlr9 = [(ev) => { bExpr3['choice'] = ev.target.value; }];
-    return block1([hdlr1, attr2, hdlr3, hdlr4, attr5, hdlr6, hdlr7, attr8, hdlr9]);
+    let attr3 = ctx['state']['choice'] === 'Three';
+    let hdlr6 = [(ev) => { bExpr3['choice'] = ev.target.value; }];
+    return block1([hdlr1, attr1, hdlr2, hdlr3, attr2, hdlr4, hdlr5, attr3, hdlr6]);
   }
 }"
 `;
@@ -166,8 +166,8 @@ exports[`t-model directive following a scope protecting directive (e.g. t-set) 1
     setContextValue(ctx, \\"admiral\\", 'Bruno');
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    return block1([attr1, hdlr2]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    return block1([attr1, hdlr1]);
   }
 }"
 `;
@@ -189,8 +189,8 @@ exports[`t-model directive in a t-foreach 1`] = `
       let key1 = ctx['thing'].id;
       const bExpr1 = ctx['thing'];
       let attr1 = ctx['thing']['f'];
-      let hdlr2 = [(ev) => { bExpr1['f'] = ev.target.checked; }];
-      c_block2[i1] = withKey(block3([attr1, hdlr2]), key1);
+      let hdlr1 = [(ev) => { bExpr1['f'] = ev.target.checked; }];
+      c_block2[i1] = withKey(block3([attr1, hdlr1]), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -216,8 +216,8 @@ exports[`t-model directive in a t-foreach, part 2 1`] = `
       let key1 = ctx['thing_index'];
       const bExpr1 = ctx['state'];
       let attr1 = ctx['state'][ctx['thing_index']];
-      let hdlr2 = [(ev) => { bExpr1[ctx['thing_index']] = ev.target.value; }];
-      c_block2[i1] = withKey(block3([attr1, hdlr2]), key1);
+      let hdlr1 = [(ev) => { bExpr1[ctx['thing_index']] = ev.target.value; }];
+      c_block2[i1] = withKey(block3([attr1, hdlr1]), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -236,9 +236,9 @@ exports[`t-model directive on a select 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['color'];
-    let hdlr2 = [(ev) => { bExpr1['color'] = ev.target.value; }];
-    let txt3 = ctx['state'].color;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['color'] = ev.target.value; }];
+    let txt1 = ctx['state'].color;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -254,8 +254,8 @@ exports[`t-model directive on a select, initial state 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['color'];
-    let hdlr2 = [(ev) => { bExpr1['color'] = ev.target.value; }];
-    return block1([attr1, hdlr2]);
+    let hdlr1 = [(ev) => { bExpr1['color'] = ev.target.value; }];
+    return block1([attr1, hdlr1]);
   }
 }"
 `;
@@ -271,9 +271,9 @@ exports[`t-model directive on a sub state key 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'].something;
     let attr1 = ctx['state'].something['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    let txt3 = ctx['state'].something.text;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    let txt1 = ctx['state'].something.text;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -289,12 +289,12 @@ exports[`t-model directive on an input type=radio 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['choice'] === 'One';
-    let hdlr2 = [(ev) => { bExpr1['choice'] = ev.target.value; }];
+    let hdlr1 = [(ev) => { bExpr1['choice'] = ev.target.value; }];
     const bExpr2 = ctx['state'];
-    let attr3 = ctx['state']['choice'] === 'Two';
-    let hdlr4 = [(ev) => { bExpr2['choice'] = ev.target.value; }];
-    let txt5 = ctx['state'].choice;
-    return block1([attr1, hdlr2, attr3, hdlr4, txt5]);
+    let attr2 = ctx['state']['choice'] === 'Two';
+    let hdlr2 = [(ev) => { bExpr2['choice'] = ev.target.value; }];
+    let txt1 = ctx['state'].choice;
+    return block1([attr1, hdlr1, attr2, hdlr2, txt1]);
   }
 }"
 `;
@@ -310,11 +310,11 @@ exports[`t-model directive on an input type=radio, with initial value 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['choice'] === 'One';
-    let hdlr2 = [(ev) => { bExpr1['choice'] = ev.target.value; }];
+    let hdlr1 = [(ev) => { bExpr1['choice'] = ev.target.value; }];
     const bExpr2 = ctx['state'];
-    let attr3 = ctx['state']['choice'] === 'Two';
-    let hdlr4 = [(ev) => { bExpr2['choice'] = ev.target.value; }];
-    return block1([attr1, hdlr2, attr3, hdlr4]);
+    let attr2 = ctx['state']['choice'] === 'Two';
+    let hdlr2 = [(ev) => { bExpr2['choice'] = ev.target.value; }];
+    return block1([attr1, hdlr1, attr2, hdlr2]);
   }
 }"
 `;
@@ -331,13 +331,13 @@ exports[`t-model directive on an input, type=checkbox 1`] = `
     let b2,b3;
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['flag'];
-    let hdlr2 = [(ev) => { bExpr1['flag'] = ev.target.checked; }];
+    let hdlr1 = [(ev) => { bExpr1['flag'] = ev.target.checked; }];
     if (ctx['state'].flag) {
       b2 = text(\`yes\`);
     } else {
       b3 = text(\`no\`);
     }
-    return block1([attr1, hdlr2], [b2, b3]);
+    return block1([attr1, hdlr1], [b2, b3]);
   }
 }"
 `;
@@ -353,9 +353,9 @@ exports[`t-model directive on an textarea 1`] = `
   return function template(ctx, node, key = \\"\\") {
     const bExpr1 = ctx['state'];
     let attr1 = ctx['state']['text'];
-    let hdlr2 = [(ev) => { bExpr1['text'] = ev.target.value; }];
-    let txt3 = ctx['state'].text;
-    return block1([attr1, hdlr2, txt3]);
+    let hdlr1 = [(ev) => { bExpr1['text'] = ev.target.value; }];
+    let txt1 = ctx['state'].text;
+    return block1([attr1, hdlr1, txt1]);
   }
 }"
 `;
@@ -375,14 +375,14 @@ exports[`t-model directive two inputs in a div alternating with a t-if 1`] = `
     if (ctx['state'].flag) {
       const bExpr1 = ctx['state'];
       let attr1 = ctx['state']['text1'];
-      let hdlr2 = [(ev) => { bExpr1['text1'] = ev.target.value; }];
-      b2 = block2([attr1, hdlr2]);
+      let hdlr1 = [(ev) => { bExpr1['text1'] = ev.target.value; }];
+      b2 = block2([attr1, hdlr1]);
     }
     if (!ctx['state'].flag) {
       const bExpr2 = ctx['state'];
-      let attr3 = ctx['state']['text2'];
-      let hdlr4 = [(ev) => { bExpr2['text2'] = ev.target.value; }];
-      b3 = block3([attr3, hdlr4]);
+      let attr2 = ctx['state']['text2'];
+      let hdlr2 = [(ev) => { bExpr2['text2'] = ev.target.value; }];
+      b3 = block3([attr2, hdlr2]);
     }
     return block1([], [b2, b3]);
   }
diff --git a/tests/components/__snapshots__/t_on.test.ts.snap b/tests/components/__snapshots__/t_on.test.ts.snap
index 0d6c6d86..e3a33a24 100644
--- a/tests/components/__snapshots__/t_on.test.ts.snap
+++ b/tests/components/__snapshots__/t_on.test.ts.snap
@@ -50,8 +50,8 @@ exports[`t-on t-on expression in t-foreach 1`] = `
       let txt2 = ctx['val']+'';
       const v1 = ctx['otherState'];
       const v2 = ctx['val'];
-      let hdlr3 = [()=>v1.vals.push(v2), ctx];
-      c_block2[i1] = withKey(block3([txt1, txt2, hdlr3]), key1);
+      let hdlr1 = [()=>v1.vals.push(v2), ctx];
+      c_block2[i1] = withKey(block3([txt1, txt2, hdlr1]), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -84,8 +84,8 @@ exports[`t-on t-on expression in t-foreach with t-set 1`] = `
       const v1 = ctx['otherState'];
       const v2 = ctx['val'];
       const v3 = ctx['bossa'];
-      let hdlr3 = [()=>v1.vals.push(v2+'_'+v3), ctx];
-      c_block2[i1] = withKey(block3([txt1, txt2, hdlr3]), key1);
+      let hdlr1 = [()=>v1.vals.push(v2+'_'+v3), ctx];
+      c_block2[i1] = withKey(block3([txt1, txt2, hdlr1]), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
@@ -112,8 +112,8 @@ exports[`t-on t-on method call in t-foreach 1`] = `
       let txt1 = ctx['val_index'];
       let txt2 = ctx['val']+'';
       const v1 = ctx['val'];
-      let hdlr3 = [()=>this.addVal(v1), ctx];
-      c_block2[i1] = withKey(block3([txt1, txt2, hdlr3]), key1);
+      let hdlr1 = [()=>this.addVal(v1), ctx];
+      c_block2[i1] = withKey(block3([txt1, txt2, hdlr1]), key1);
     }
     let b2 = list(c_block2);
     return block1([], [b2]);
diff --git a/tests/components/__snapshots__/t_set.test.ts.snap b/tests/components/__snapshots__/t_set.test.ts.snap
index 39b9525c..856f76f8 100644
--- a/tests/components/__snapshots__/t_set.test.ts.snap
+++ b/tests/components/__snapshots__/t_set.test.ts.snap
@@ -8,7 +8,7 @@ exports[`t-set slot setted value (with t-set) not accessible with t-esc 1`] = `
   
   let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
   
-  function slot2(ctx, node, key = \\"\\") {
+  function slot1(ctx, node, key = \\"\\") {
     ctx = Object.create(ctx);
     ctx[isBoundary] = 1
     setContextValue(ctx, \\"iter\\", 'inCall');
@@ -21,7 +21,7 @@ exports[`t-set slot setted value (with t-set) not accessible with t-esc 1`] = `
     setContextValue(ctx, \\"iter\\", 'source');
     let txt1 = ctx['iter'];
     const ctx1 = capture(ctx);
-    let b2 = component(\`Childcomp\`, {slots: {'default': {__render: slot2, __ctx: ctx1}}}, key + \`__3\`, node, ctx);
+    let b2 = component(\`Childcomp\`, {slots: {'default': {__render: slot1, __ctx: ctx1}}}, key + \`__1\`, node, ctx);
     let txt2 = ctx['iter'];
     return block1([txt1, txt2], [b2]);
   }
diff --git a/tests/misc/__snapshots__/memo.test.ts.snap b/tests/misc/__snapshots__/memo.test.ts.snap
index 7c2bea03..a2c74175 100644
--- a/tests/misc/__snapshots__/memo.test.ts.snap
+++ b/tests/misc/__snapshots__/memo.test.ts.snap
@@ -16,7 +16,7 @@ exports[`Memo if no prop change, prevent renderings from above  1`] = `
     let b2 = text(ctx['state'].a);
     let b3 = text(ctx['state'].b);
     let b4 = text(ctx['state'].c);
-    let b9 = component(\`Memo\`, {a: ctx['state'].a,b: ctx['state'].b,slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b9 = component(\`Memo\`, {a: ctx['state'].a,b: ctx['state'].b,slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return multi([b2, b3, b4, b9]);
   }
 }"
@@ -27,13 +27,13 @@ exports[`Memo if no props, prevent renderings from above  1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   
-  function slot2(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {value: ctx['state'].value}, key + \`__3\`, node, ctx);
+  function slot1(ctx, node, key = \\"\\") {
+    return component(\`Child\`, {value: ctx['state'].value}, key + \`__2\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let b2 = component(\`Child\`, {value: ctx['state'].value}, key + \`__1\`, node, ctx);
-    let b4 = component(\`Memo\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__4\`, node, ctx);
+    let b4 = component(\`Memo\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
     return multi([b2, b4]);
   }
 }"
@@ -61,7 +61,7 @@ exports[`Memo if no props, prevent renderings from above (work with simple html)
   
   return function template(ctx, node, key = \\"\\") {
     let b2 = text(ctx['state'].value);
-    let b4 = component(\`Memo\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b4 = component(\`Memo\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return multi([b2, b4]);
   }
 }"
diff --git a/tests/misc/__snapshots__/portal.test.ts.snap b/tests/misc/__snapshots__/portal.test.ts.snap
index 7ae80c22..c5b09eee 100644
--- a/tests/misc/__snapshots__/portal.test.ts.snap
+++ b/tests/misc/__snapshots__/portal.test.ts.snap
@@ -8,11 +8,11 @@ exports[`Portal Portal composed with t-slot 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child2\`, {customHandler: ctx['_handled']}, key + \`__2\`, node, ctx);
+    return component(\`Child2\`, {customHandler: ctx['_handled']}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -29,7 +29,7 @@ exports[`Portal Portal composed with t-slot 2`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    return component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    return component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
   }
 }"
 `;
@@ -61,7 +61,7 @@ exports[`Portal basic use of portal 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -80,9 +80,9 @@ exports[`Portal basic use of portal in dev mode 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    const props2 = {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}
-    helpers.validateProps(\`Portal\`, props2, ctx)
-    let b3 = component(\`Portal\`, props2, key + \`__3\`, node, ctx);
+    const props1 = {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}
+    helpers.validateProps(\`Portal\`, props1, ctx)
+    let b3 = component(\`Portal\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -96,14 +96,14 @@ exports[`Portal conditional use of Portal (with sub Component) 1`] = `
   let block2 = createBlock(\`<span>1</span>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {val: ctx['state'].val}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {val: ctx['state'].val}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let b2,b4;
     b2 = block2();
     if (ctx['state'].hasPortal) {
-      b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+      b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     }
     return multi([b2, b4]);
   }
@@ -140,7 +140,7 @@ exports[`Portal conditional use of Portal 1`] = `
     let b2,b4;
     b2 = block2();
     if (ctx['state'].hasPortal) {
-      b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+      b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     }
     return multi([b2, b4]);
   }
@@ -155,13 +155,13 @@ exports[`Portal lifecycle hooks of portal sub component are properly called 1`]
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {val: ctx['state'].val}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {val: ctx['state'].val}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
     let b3;
     if (ctx['state'].hasChild) {
-      b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+      b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     }
     return block1([], [b3]);
   }
@@ -200,7 +200,7 @@ exports[`Portal portal could have dynamically no content 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b4]);
   }
 }"
@@ -214,11 +214,11 @@ exports[`Portal portal destroys on crash 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {error: ctx['state'].error}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {error: ctx['state'].error}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -246,11 +246,11 @@ exports[`Portal portal with child and props 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {val: ctx['state'].val}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {val: ctx['state'].val}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -291,7 +291,7 @@ exports[`Portal portal with dynamic body 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b5 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b5 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -313,7 +313,7 @@ exports[`Portal portal with many children 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b5 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b5 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b5]);
   }
 }"
@@ -335,7 +335,7 @@ exports[`Portal portal with no content 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b4 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b4]);
   }
 }"
@@ -353,7 +353,7 @@ exports[`Portal portal with only text as content 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -372,7 +372,7 @@ exports[`Portal portal with target not in dom 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#does-not-exist',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#does-not-exist',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -386,11 +386,11 @@ exports[`Portal portal's parent's env is not polluted 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -422,7 +422,7 @@ exports[`Portal with target in template (after portal) 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#local-target',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#local-target',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -441,7 +441,7 @@ exports[`Portal with target in template (before portal) 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#local-target',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#local-target',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -460,9 +460,9 @@ exports[`Portal: Props validation target is mandatory 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    const props2 = {slots: {'default': {__render: slot1, __ctx: ctx}}}
-    helpers.validateProps(\`Portal\`, props2, ctx)
-    let b3 = component(\`Portal\`, props2, key + \`__3\`, node, ctx);
+    const props1 = {slots: {'default': {__render: slot1, __ctx: ctx}}}
+    helpers.validateProps(\`Portal\`, props1, ctx)
+    let b3 = component(\`Portal\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -481,9 +481,9 @@ exports[`Portal: Props validation target is not list 1`] = `
   }
   
   return function template(ctx, node, key = \\"\\") {
-    const props2 = {target: ['body'],slots: {'default': {__render: slot1, __ctx: ctx}}}
-    helpers.validateProps(\`Portal\`, props2, ctx)
-    let b3 = component(\`Portal\`, props2, key + \`__3\`, node, ctx);
+    const props1 = {target: ['body'],slots: {'default': {__render: slot1, __ctx: ctx}}}
+    helpers.validateProps(\`Portal\`, props1, ctx)
+    let b3 = component(\`Portal\`, props1, key + \`__1\`, node, ctx);
     return block1([], [b3]);
   }
 }"
@@ -497,11 +497,11 @@ exports[`Portal: UI/UX focus is kept across re-renders 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   function slot1(ctx, node, key = \\"\\") {
-    return component(\`Child\`, {val: ctx['state'].val}, key + \`__2\`, node, ctx);
+    return component(\`Child\`, {val: ctx['state'].val}, key + \`__1\`, node, ctx);
   }
   
   return function template(ctx, node, key = \\"\\") {
-    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
+    let b3 = component(\`Portal\`, {target: '#outside',slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
     return block1([], [b3]);
   }
 }"