Adjust component prop metadata labels (#5569)

* adjust coloring * connected to data * use `controlled` * always pointer
concrete-utopia · May 5, 2024 · 9da7f27 · 9da7f27
1 parent 4defc57
commit 9da7f27
Showing 1 changed file with 8 additions and 5 deletions.
diff --git a/editor/src/components/inspector/sections/component-section/component-section.tsx b/editor/src/components/inspector/sections/component-section/component-section.tsx
@@ -388,8 +388,8 @@ const RowForBaseControl = React.memo((props: RowForBaseControlProps) => {
     setIsHovered(false)
   }
 
-  const isValueSet = React.useMemo(() => {
-    return propMetadata.propertyStatus.set
+  const isConnectedToData = React.useMemo(() => {
+    return propMetadata.propertyStatus.controlled
   }, [propMetadata])
 
   const propertyLabel =
@@ -415,22 +415,25 @@ const RowForBaseControl = React.memo((props: RowForBaseControlProps) => {
               alignItems: 'center',
               gap: 6,
               color:
-                dataPickerButtonData.popupIsOpen || isHovered || !isValueSet
+                dataPickerButtonData.popupIsOpen || isHovered || isConnectedToData
                   ? colorTheme.dynamicBlue.value
                   : undefined,
+              cursor: 'pointer',
             }}
           >
             {title}
             <div
               style={{
-                opacity: isHovered || dataPickerButtonData.popupIsOpen || !isValueSet ? 1 : 0,
+                opacity: isHovered || dataPickerButtonData.popupIsOpen ? 1 : 0,
               }}
             >
               <Icn
                 category='semantic'
                 type='plus-in-white-translucent-circle'
                 color={
-                  dataPickerButtonData.popupIsOpen || isHovered || !isValueSet ? 'dynamic' : 'main'
+                  dataPickerButtonData.popupIsOpen || isHovered || !isConnectedToData
+                    ? 'dynamic'
+                    : 'main'
                 }
                 width={12}
                 height={12}