diff --git a/src/block/button-group/edit.js b/src/block/button-group/edit.js index b718591d9..a44a4f46d 100644 --- a/src/block/button-group/edit.js +++ b/src/block/button-group/edit.js @@ -33,7 +33,7 @@ import { FlexGapControls, Transform, } from '~stackable/block-components' -import { useBlockContext, useDeviceType } from '~stackable/hooks' +import { useDeviceType } from '~stackable/hooks' import { withBlockAttributeContext, withBlockWrapperIsHovered, @@ -49,6 +49,7 @@ import { } from '@wordpress/block-editor' import { sprintf, __ } from '@wordpress/i18n' import { memo } from '@wordpress/element' +import { useSelect } from '@wordpress/data' const ALLOWED_INNER_BLOCKS = [ 'stackable/button', 'stackable/icon-button' ] @@ -109,7 +110,12 @@ const Edit = props => { const deviceType = useDeviceType() const rowClass = getRowClasses( attributes ) const blockAlignmentClass = getAlignmentClasses( attributes ) - const { hasInnerBlocks } = useBlockContext() + const { hasInnerBlocks } = useSelect( select => { + const { getBlockOrder } = select( 'core/block-editor' ) + return { + hasInnerBlocks: getBlockOrder( props.clientId ).length > 0, + } + }, [ props.clientId ] ) const blockClassNames = classnames( [ className, @@ -176,16 +182,15 @@ const Edit = props => { { ! hasInnerBlocks && } - { hasInnerBlocks && -
- -
- } +
+ +
{ props.isHovered && hasInnerBlocks && } diff --git a/src/block/button-group/variations.js b/src/block/button-group/variations.js index 8753be419..7da4fe73d 100644 --- a/src/block/button-group/variations.js +++ b/src/block/button-group/variations.js @@ -31,12 +31,7 @@ const variations = [ 'stk-type': 'essential', 'stk-demo': 'https://wpstackable.com/button-block/?utm_source=welcome&utm_medium=settings&utm_campaign=view_demo&utm_content=demolink', isDefault: true, - innerBlocks: [ - [ - 'stackable/button', - {}, - ], - ], + innerBlocks: [], example: buttonExample, }, {