Custom components used in Symbol do not have Input Options available when editing the Symbol

Builder content link
https://preview.builder.codes?model=symbol

Builder public api key
1bfa47d2225c49359bd14da5ad12aa05

What are you trying to accomplish
I want to have a Symbol with custom components that I can reuse throughout our site.

Currently, I am not seeing the Custom Component options when editing a Symbol with those components in it.

Screenshots
options not visible on the UI

options available in JSON View
Screen Shot 2022-02-16 at 4.21.35 PM

options I see when I use the custom component without the Symbol

Code stack you are integrating Builder with
NextJS

Hi @Guili23,

This is expected behavior, a custom components options won’t be editable if used within a symbol on a page. In order to make these component’s options editable while using the symbol on a page, you would need to either make the symbol inline or add content inputs in your symbol and bind these to the custom component inputs. I’d recommend checking out our symbol with inputs guide, let us know if you have any additional questions!

https://preview.builder.codes?model=symbol

Currently trying the same, right-clicked a rendered custom component and created a symbol, when I try to edit it it just gives a blank screen so I can’t bind to anything using the above fix- also the right-click menu isn’t working on the symbol on the original page and it’s blank in the symbols menu (where I’d expect a preview).
Thanks.

Wanted to update this forum post, that if you set a dynamic data binding for the various custom component fields, you can use the symbol with inputs workflow, outlined here: Adding Inputs to Symbols - Builder.io to surface the custom component inputs to a user when the symbol is dropped on the page. Try it out and see ifthat works for you!