diff --git a/packages/block-library/src/post-author/edit.js b/packages/block-library/src/post-author/edit.js index 6186b0d052e8aa..81d139ff995887 100644 --- a/packages/block-library/src/post-author/edit.js +++ b/packages/block-library/src/post-author/edit.js @@ -15,10 +15,11 @@ import { } from '@wordpress/block-editor'; import { ComboboxControl, - PanelBody, SelectControl, ToggleControl, __experimentalVStack as VStack, + __experimentalToolsPanel as ToolsPanel, + __experimentalToolsPanelItem as ToolsPanelItem, } from '@wordpress/components'; import { useSelect, useDispatch } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; @@ -100,84 +101,155 @@ function PostAuthorEdit( { return ( <> - - + { + setAttributes( { + avatarSize: 48, + showAvatar: true, + isLink: false, + linkTarget: '_self', + } ); + } } > - { showAuthorControl && - ( ( showCombobox && ( - - ) ) || ( - - ) ) } - authorId } + onDeselect={ () => + setAttributes( { authorId: null } ) + } + > + { ( showCombobox && ( + + ) ) || ( + + ) } + + ) } + - setAttributes( { showAvatar: ! showAvatar } ) + isShownByDefault + hasValue={ () => showAvatar } + onDeselect={ () => + setAttributes( { showAvatar: true } ) } - /> - { showAvatar && ( - + { + label={ __( 'Show avatar' ) } + checked={ showAvatar } + onChange={ () => setAttributes( { - avatarSize: Number( size ), - } ); - } } + showAvatar: ! showAvatar, + } ) + } /> + + { showAvatar && ( + attributes.avatarSize } + onDeselect={ () => + setAttributes( { avatarSize: 48 } ) + } + > + { + setAttributes( { + avatarSize: Number( size ), + } ); + } } + /> + ) } - - setAttributes( { showBio: ! showBio } ) + isShownByDefault + hasValue={ () => showBio } + onDeselect={ () => + setAttributes( { showBio: true } ) } - /> - - setAttributes( { isLink: ! isLink } ) + > + + setAttributes( { showBio: ! showBio } ) + } + /> + + isLink } + onDeselect={ () => + setAttributes( { isLink: false } ) } - /> - { isLink && ( + > - setAttributes( { - linkTarget: value ? '_blank' : '_self', - } ) + label={ __( + 'Link author name to author page' + ) } + checked={ isLink } + onChange={ () => + setAttributes( { isLink: ! isLink } ) } - checked={ linkTarget === '_blank' } /> + + { isLink && ( + linkTarget } + onDeselect={ () => + setAttributes( { linkTarget: '_self' } ) + } + > + + setAttributes( { + linkTarget: value + ? '_blank' + : '_self', + } ) + } + checked={ linkTarget === '_blank' } + /> + ) } - - + +