Code SourcesAdvanced Prop Configurations

Using Components as Props

Discover the power of using components as props to create more modular and reusable code.
View as Markdown

Note: Currently, this feature is only available for our React renderer.

Overview

This section will show you how to pass entire components as props, enabling greater flexibility and customization in your applications.

1

Step 1: Adding the initial slot

The first step in the process involves adding the initial slot and then opening up the configuration options.

2

Step 2: Enable the option for "Component as a prop"

Near the bottom of the configuration for the slot is a boolean option to enable/disable component as a prop.

3

Step 3: Optionally, enable "Allowed Patterns"

This is useful if this slot should only be able to receive certain components. The default is all components registered in the inventory.

4

Step 4: Click the "Save Changes" button and begin adding components as props!

The last step is to save the changes. Click the blue “Save Changes” button and begin adding components as props.

Screenshot 2024-07-25 at 10.25.15 AM.png

Conclusion

Pulling it all together we can now use components as props 🎉

Screenshot 2024-07-25 at 10.27.37 AM.png