I'll create a low code UI builder with an iterative block feature that can pass selected data fields to child blocks. This is perfect for creating dynamic UIs that render collections of data.

This low code UI builder allows you to create dynamic interfaces by iterating over data collections and passing selected fields to child components. Here's how it works:

Key Features

1. Iterator Block: This special block can loop over a data source (like Users or Products) and render child components for each item in the collection.
2. Field Selection: In the properties panel, you can select which fields from the data source should be passed to child components.
3. Dynamic Content: Child blocks can use the data from parent iterators by using the {fieldName} syntax in their content.

How to Use

1. Add Components: Drag components from the left palette to the canvas.
2. Create an Iterator: Add an Iterator block, select a data source, and choose which fields to pass to children.
3. Add Child Components: Add Text, Image, Card, or Button components inside the Iterator.
4. Use Dynamic Data: In child components, use {fieldName} to insert data from the parent iterator.

For example, you could create a user list by:

• Adding an Iterator with the "Users" data source
• Selecting "name" and "email" fields
• Adding a Card inside with title set to "User: name"
• Adding a Text component with content "email"

The builder will automatically render a card for each user in the data source, with the dynamic content filled in from the selected fields.