Commit 64468938c4c for woocommerce

commit 64468938c4cb0a43ffb9dd8f4e3bdc267f839c1a
Author: Rishabh Gupta <109821717+R1shabh-Gupta@users.noreply.github.com>
Date:   Mon Jun 1 13:46:29 2026 +0530

    Replace PanelBody with ToolsPanel in Coming Soon block (#64768)

    * Replace PanelBody with ToolsPanel in coming-soon block

    * Add changelog for coming-soon ToolsPanel update

    * move constant after the return

    ---------

    Co-authored-by: Luigi Teschio <gigitux@gmail.com>

diff --git a/plugins/woocommerce/changelog/59464-use-toolspanel-in-coming-soon-block b/plugins/woocommerce/changelog/59464-use-toolspanel-in-coming-soon-block
new file mode 100644
index 00000000000..6e972f8ca32
--- /dev/null
+++ b/plugins/woocommerce/changelog/59464-use-toolspanel-in-coming-soon-block
@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Replaces PanelBody with ToolsPanel in the Coming Soon block
diff --git a/plugins/woocommerce/client/blocks/assets/js/blocks/coming-soon/edit.tsx b/plugins/woocommerce/client/blocks/assets/js/blocks/coming-soon/edit.tsx
index 81090cd5ebf..ad9bfddd461 100644
--- a/plugins/woocommerce/client/blocks/assets/js/blocks/coming-soon/edit.tsx
+++ b/plugins/woocommerce/client/blocks/assets/js/blocks/coming-soon/edit.tsx
@@ -7,8 +7,14 @@ import {
 	useBlockProps,
 	InnerBlocks,
 } from '@wordpress/block-editor';
-import { PanelBody, ColorPicker } from '@wordpress/components';
 import { type BlockEditProps } from '@wordpress/blocks';
+import {
+	ColorPicker,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis
+	__experimentalToolsPanel as ToolsPanel,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis
+	__experimentalToolsPanelItem as ToolsPanelItem,
+} from '@wordpress/components';

 export type Attributes = {
 	color?: string;
@@ -36,19 +42,35 @@ export default function Edit( { attributes, setAttributes }: EditProps ) {
 		);
 	}

+	const DEFAULT_COLOR = '#bea0f2';
+
 	return (
 		<>
 			<InspectorControls>
-				<PanelBody title={ __( 'Settings', 'woocommerce' ) }>
-					<ColorPicker
-						color={ color }
-						onChange={ ( newColor: string ) =>
-							setAttributes( { color: newColor } )
+				<ToolsPanel
+					label={ __( 'Settings', 'woocommerce' ) }
+					resetAll={ () => {
+						setAttributes( { color: DEFAULT_COLOR } );
+					} }
+				>
+					<ToolsPanelItem
+						hasValue={ () => color !== DEFAULT_COLOR }
+						label={ __( 'Color', 'woocommerce' ) }
+						onDeselect={ () =>
+							setAttributes( { color: DEFAULT_COLOR } )
 						}
-						enableAlpha
-						defaultValue="#bea0f2"
-					/>
-				</PanelBody>
+						isShownByDefault
+					>
+						<ColorPicker
+							color={ color }
+							onChange={ ( newColor: string ) =>
+								setAttributes( { color: newColor } )
+							}
+							enableAlpha
+							defaultValue={ DEFAULT_COLOR }
+						/>
+					</ToolsPanelItem>
+				</ToolsPanel>
 			</InspectorControls>
 			<div { ...blockProps }>
 				<InnerBlocks />