<g transform="translate({{marginLeft}},{{marginTop}})">

  {{#let (e-s/pojo 
    linear=(linear-scale
      x-domain
      (append 0 innerWidth)
      round=true
      padding=0.2
    ) 
    band=(band-scale
      x-domain
      (append 0 innerWidth)
      round=true
      padding=0.2
    ) 
    time=(time-scale
      x-domain
      (append 0 innerWidth)
      round=true
      padding=0.2
    ) 
  ) as |scales|}}
  {{#let 
    (get scales (or scale-type 'linear'))

    (linear-scale
      y-domain
      (append innerHeight 0)
    )

    (cat-color-scale
      (or color-scale-type '20b')
      domain=group-domain
    )

    (e-s/transition
      duration=(or transition-duration 1000)
      data=data
    )

    (r/get (or input-key 0))
    (r/get (or output-key 1))
  as |x-scale y-scale color-scale transition inputKey outputKey|}}

  {{yield (e-s/pojo
    x-scale=x-scale
    y-scale=y-scale

    x-axis=(component 'e-s/axis'
      scale=x-scale
      position='bottom'
      height=innerHeight
      transition=transition
      label-attrs=(pipe (d3-attr 'x' width))
    )

    y-axis=(component 'e-s/axis'
      scale=y-scale
      position='left'
      width=innerWidth
      transition=transition
      label-attrs=(pipe (d3-attr 'transform' 'rotate(-90)'))
    )

    bar-chart=(component 'e-s/bar-chart'
      data=data
      xScale=x-scale
      yScale=y-scale

      inputKey=inputKey
      outputKey=outputKey

      transition=transition
      width=innerWidth
      height=innerHeight
    )

    grouped-bar-chart=(component 'e-s/grouped-bar-chart'
      data=data
      xScale=x-scale
      yScale=y-scale
      colorScale=color-scale
      groupScale=(band-scale
        group-domain
        (append 0 (compute (e-s/bandwidth x-scale)))
        padding=(or group-padding 0.05)
      )

      inputKey=inputKey
      outputKey=outputKey
      groupKey=(r/get group-key)
      valueKey=(r/get value-key)

      transition=transition
      width=innerWidth
      height=innerHeight
    )

    line-chart=(component 'e-s/line-chart'
      data=data
      xScale=x-scale
      yScale=y-scale
      colorScale=color-scale

      inputKey=inputKey
      outputKey=outputKey
      groupKey=(r/get (or group-key ''))

      transition=transition
      width=innerWidth
      height=innerHeight
    )

    pie-chart=(component 'e-s/pie-chart'
      data=(e-s/pie-data data valueKey=output-key threshold=arc-threshold precision=arc-precision)
      width=innerWidth
      height=innerHeight

      outputKey=outputKey
      groupKey=(r/get (concat 'data.' group-key))

      colorScale=color-scale
      radius=(div (d3-array 'min' (array innerWidth innerHeight)) 2)
      transition=transition
    )

    legend=(component 'e-s/legend'
      width=innerWidth
      height=innerHeight
      domain=group-domain
      colorScale=color-scale
      transition=transition
      shape=(or shape 'rect')
      dx=(or dx 0)
      dy=(or dy 0)
    )

    width=innerWidth
    height=innerHeight
    transition=transition
  )}}

  {{/let}}
  {{/let}}

</g>