Related Products: Move Notice block to the Inspector Control section (https://github.com/woocommerce/woocommerce-blocks/pull/8843)

* Add Notice component to the Inspector Controls section of the Related Products block

* Change margin css attribute to use the short syntax

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
This commit is contained in:
Alexandre Lara 2023-03-24 14:03:12 -03:00 committed by GitHub
parent 91eb482e17
commit 22a9a479ae
2 changed files with 9 additions and 5 deletions

View File

@ -5,9 +5,13 @@ import {
BLOCK_ATTRIBUTES,
INNER_BLOCKS_TEMPLATE,
} from '@woocommerce/blocks/product-query/variations';
import { InnerBlocks, useBlockProps } from '@wordpress/block-editor';
import {
InnerBlocks,
InspectorControls,
useBlockProps,
} from '@wordpress/block-editor';
import { InnerBlockTemplate } from '@wordpress/blocks';
import { Disabled, Notice } from '@wordpress/components';
import { Notice } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
/**
@ -23,7 +27,7 @@ const Edit = () => {
return (
<div { ...blockProps }>
<Disabled>
<InspectorControls>
<Notice
className={ 'wc-block-editor-related-products__notice' }
status={ 'warning' }
@ -36,7 +40,7 @@ const Edit = () => {
) }
</p>
</Notice>
</Disabled>
</InspectorControls>
<InnerBlocks template={ TEMPLATE } />
</div>
);

View File

@ -1,4 +1,4 @@
.wc-block-editor-related-products__notice {
margin: 10px auto;
margin: auto $gap $gap;
max-width: max-content;
}