Home App Docs Blog Github

Enum for backgroundColor prop in a custom react/next component using variables from global stylesheet


I have a custom component in React that uses properties from a global stylesheet as well as a local stylesheet. My goal is to register the component with a background color prop, and give an enum of available color choices from the CSS variables defined in the global stylesheet. I have the backgroundColor successfully registered and the color is able to be manipulated in the builder CMS, however the enum list is not displaying the listed color choices. Can I get some help with this integration? Attached is a code sandbox for reference.

Hi @rdonahue :wave:

The enum list is not displaying the listed color choices because instead of type: "color" it should be type: 'text' (line 63 in the HeroHalf.jsx file).

1 Like