Subcomponents can't be initialized as field then used in the template 🐛
This may be a feature request if some alternative but hard-to-anticipate mechanism is built in.

**To Reproduce** 👨‍🔬
It's natural to want to make components modular. Hence we would want to have some components as fields of another component.

```

component CTestChild:
  id: int
  color: cstring
  `template`:
    tDiv(style=fmt"color:{self.color};"):
      "subcomponent ID: {self.id}"

var ctest1 = use component CTestChild(id=1, color = "green")

component CTest:
  id: int
  newId: cstring = "newId: " & $id
  message: cstring = ""
  child: CTestChild = use component CTestChild(id = self.id.val, color ="red")
  `template`:
    component self.child.val
   #component self.child
    tDiv: "template: {self.id} {self.newId}"

var test1 = use component CTest(id= 1)

appRoutes("ROOT"):
  "/":
    tDiv: component test1
    tDiv: component CTest(id = 7)

```

However, the macros currently don't support this syntax:

``` Error: Invalid node kind nnkDotExpr for macros.`$` ```
