Merge 7e14a57 into aef276c

material-components · Jul 11, 2022 · dfa39fa · dfa39fa
2 parents aef276c + 7e14a57
commit dfa39fa
Showing 1 changed file with 20 additions and 18 deletions.
diff --git a/plugin/assets/src/customizer/components/color-control/index.js b/plugin/assets/src/customizer/components/color-control/index.js
@@ -73,24 +73,26 @@ const ColorControl = ( { defaultValue, params, onColorChange, mode } ) => {
 	};
 
 	useEffect( () => {
-		let hexColor = color.substring( 1 );
-
-		if ( hexColor.length === 3 ) {
-			hexColor = hexColor
-				.split( '' )
-				.map( hex => hex + hex )
-				.join( '' );
+		if ( color ) {
+			let hexColor = color.substring( 1 );
+
+			if ( hexColor.length === 3 ) {
+				hexColor = hexColor
+					.split( '' )
+					.map( hex => hex + hex )
+					.join( '' );
+			}
+
+			if ( 6 !== hexColor.length ) {
+				return;
+			}
+
+			onColorChange( `#${ hexColor }` );
+			api.previewer.send( 'materialDesignM3PaletteUpdate', {
+				color,
+				isDarkMode,
+			} );
 		}
-
-		if ( 6 !== hexColor.length ) {
-			return;
-		}
-
-		onColorChange( `#${ hexColor }` );
-		api.previewer.send( 'materialDesignM3PaletteUpdate', {
-			color,
-			isDarkMode,
-		} );
 	}, [ color ] );
 
 	return (
@@ -179,7 +181,7 @@ const ColorControl = ( { defaultValue, params, onColorChange, mode } ) => {
 								<MaterialColorPalette
 									value={ color }
 									onChange={ value => {
-										onChange( value );
+										onChange( value ?? '#ffffff' ); // Use white as default.
 									} }
 									materialColorsOnly={ true }
 								/>