Ensures the input field stays in sync with color changes

WordPress · Feb 19, 2025 · 605f706 · 605f706
1 parent 1c78ef7
commit 605f706
Showing 1 changed file with 5 additions and 0 deletions.
diff --git a/packages/components/src/color-palette/index.tsx b/packages/components/src/color-palette/index.tsx
@@ -65,6 +65,10 @@ function CustomColorValueInput( {
 	const inputRef = useRef< HTMLInputElement >( null );
 	const truncateRef = useRef< HTMLDivElement >( null );
 
+	useEffect( () => {
+		setInputValue( value );
+	}, [ value ] );
+
 	useEffect( () => {
 		if ( isEditing && inputRef.current ) {
 			inputRef.current.focus();
@@ -111,6 +115,7 @@ function CustomColorValueInput( {
 	if ( isEditing && isHex ) {
 		return (
 			<input
+				ref={ inputRef }
 				type="text"
 				value={ inputValue || '' }
 				onChange={ handleChange }