[RNMobile] Color settings

packages/block-library/src/button/color-edit.js

@@ -52,14 +52,14 @@ const cleanEmptyObject = ( object ) => {
 		: cleanedNestedObjects;
 };
 
-function ColorPanel( { settings, clientId, enableContrastChecking = isWebPlatform } ) {
+function ColorPanel( { settings, clientId, enableContrastChecking = true } ) {
 	const { getComputedStyle, Node } = window;
 
 	const [ detectedBackgroundColor, setDetectedBackgroundColor ] = useState();
 	const [ detectedColor, setDetectedColor ] = useState();
 
 	useEffect( () => {
-		if ( ! enableContrastChecking ) {
+		if ( isWebPlatform && ! enableContrastChecking ) {
 			return;
 		}
 
@@ -92,7 +92,7 @@ function ColorPanel( { settings, clientId, enableContrastChecking = isWebPlatfor
 				initialOpen={ false }
 				settings={ settings }
 			>
-				{ enableContrastChecking && (
+				{ isWebPlatform && enableContrastChecking && (
 					<ContrastChecker
 						backgroundColor={ detectedBackgroundColor }
 						textColor={ detectedColor }
@@ -193,7 +193,9 @@ function ColorEdit( props ) {
 
 	return (
 		<ColorPanel
-			enableContrastChecking={ isWebPlatform && ! gradient && ! style?.color?.gradient }
+			enableContrastChecking={
+				isWebPlatform && ! gradient && ! style?.color?.gradient
+			}
 			clientId={ props.clientId }
 			settings={ [
 				{

packages/block-library/src/button/edit.native.js

@@ -174,9 +174,8 @@ class ButtonEdit extends Component {
 	}
 
 	getBackgroundColor() {
-		const { backgroundColor, attributes, wrapperProps } = this.props;
+		const { backgroundColor, attributes } = this.props;
 		const { gradient, customGradient } = attributes;
-		const colorProps = getColorAndStyleProps( attributes );
 		const defaultGradients = SETTINGS_DEFAULTS.gradients;
 
 		if ( customGradient || gradient ) {
@@ -188,19 +187,17 @@ class ButtonEdit extends Component {
 			);
 		}
 		return (
-			wrapperProps?.style?.backgroundColor || colorProps.style?.backgroundColor ||
+			getColorAndStyleProps( attributes ).style?.backgroundColor ||
 			// We still need the `backgroundColor.color` to support colors from the color pallete (not custom ones)
 			backgroundColor.color ||
 			styles.defaultButton.backgroundColor
 		);
 	}
 
 	getTextColor() {
-		const { textColor, wrapperProps, attributes } = this.props;
-		const colorProps = getColorAndStyleProps( attributes );
-
+		const { textColor, attributes } = this.props;
 		return (
-			wrapperProps?.style?.color || colorProps.style?.color ||
+			getColorAndStyleProps( attributes ).style?.color ||
 			// We still need the `textColor.color` to support colors from the color pallete (not custom ones)
 			textColor.color ||
 			styles.defaultButton.color
@@ -526,7 +523,7 @@ class ButtonEdit extends Component {
 					/>
 				</BottomSheet>
 
-				<ColorEdit {...this.props} />
+				<ColorEdit { ...this.props } />
 				<InspectorControls>
 					<PanelBody title={ __( 'Border Settings' ) }>
 						<RangeControl