2024-04-23 04:07:56 +00:00
|
|
|
/**
|
|
|
|
* External dependencies
|
|
|
|
*/
|
|
|
|
import { __ } from '@wordpress/i18n';
|
|
|
|
import {
|
|
|
|
InspectorControls,
|
|
|
|
useBlockProps,
|
|
|
|
InnerBlocks,
|
|
|
|
} from '@wordpress/block-editor';
|
|
|
|
import { PanelBody, ColorPicker } from '@wordpress/components';
|
|
|
|
|
2024-04-26 04:43:08 +00:00
|
|
|
/**
|
|
|
|
* Internal dependencies
|
|
|
|
*/
|
|
|
|
import { generateStyles } from './styles';
|
|
|
|
|
2024-04-23 04:07:56 +00:00
|
|
|
export default function Edit( { attributes, setAttributes } ) {
|
2024-04-26 04:43:08 +00:00
|
|
|
const { color, storeOnly } = attributes;
|
|
|
|
const blockProps = { ...useBlockProps() };
|
|
|
|
|
|
|
|
if ( storeOnly ) {
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<div { ...blockProps }>
|
|
|
|
<InnerBlocks />
|
|
|
|
</div>
|
|
|
|
<style>{ `.woocommerce-breadcrumb {display: none;}` }</style>
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2024-04-23 04:07:56 +00:00
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<InspectorControls>
|
|
|
|
<PanelBody title={ __( 'Settings', 'woocommerce' ) }>
|
|
|
|
<ColorPicker
|
|
|
|
color={ color }
|
|
|
|
onChange={ ( newColor: string ) =>
|
|
|
|
setAttributes( { color: newColor } )
|
|
|
|
}
|
|
|
|
enableAlpha
|
|
|
|
defaultValue="#bea0f2"
|
|
|
|
/>
|
|
|
|
</PanelBody>
|
|
|
|
</InspectorControls>
|
2024-04-26 04:43:08 +00:00
|
|
|
<div { ...blockProps }>
|
2024-04-23 04:07:56 +00:00
|
|
|
<InnerBlocks />
|
|
|
|
</div>
|
2024-04-26 04:43:08 +00:00
|
|
|
<style>{ generateStyles( color ) }</style>
|
2024-04-23 04:07:56 +00:00
|
|
|
</>
|
|
|
|
);
|
|
|
|
}
|