Error when using component in collection loop

I get an error when I use a component within a loop of a collection. The same components works fine outside the loop.

Index.html

<main>
  
  {% bookshop "hero/base" title: 'My title' %}

  <section class="index-sloepen">
    {% for item in collections.sloepen %}
      {% bookshop "hero/base" title: 'My title' %}
    {% endfor %}
  </section>

</main>

Console output:

`RenderError` was thrown
> Converting circular structure to JSON
    --> starting at object with constructor 'EleventyExtensionMap'
    |     property '_engineManager' -> object with constructor 'TemplateEngineManager'
    |     property 'engineCache' -> object with constructor 'Object'
    |     property 'html' -> object with constructor 'Html'
    --- property '_extensionMap' closes the circle

I simplified it for this post, but eventually I want to pass data from my collection items to the component and render a component for each item in the collection.

I tried using a component in a frontmatter forloop, which works fine. When I loop over a collection it breaks.

[silveltman]

All works fine! Much love ❤️

[bglw]

Darn. I’ll have another dig, that trace gives me a good idea of where it’s happening, thanks 🙏