diff --git a/packages/block-library/src/post-title/edit.js b/packages/block-library/src/post-title/edit.js
index fdfb8e7c2c6cd..3df706095e5ae 100644
--- a/packages/block-library/src/post-title/edit.js
+++ b/packages/block-library/src/post-title/edit.js
@@ -15,12 +15,22 @@ import {
HeadingLevelDropdown,
useBlockEditingMode,
} from '@wordpress/block-editor';
-import { ToggleControl, TextControl, PanelBody } from '@wordpress/components';
+import {
+ ToggleControl,
+ TextControl,
+ __experimentalToolsPanel as ToolsPanel,
+ __experimentalToolsPanelItem as ToolsPanelItem,
+} from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import { createBlock, getDefaultBlockName } from '@wordpress/blocks';
import { useEntityProp, store as coreStore } from '@wordpress/core-data';
import { useSelect } from '@wordpress/data';
+/**
+ * Internal dependencies
+ */
+import { useToolsPanelDropdownMenuProps } from '../utils/hooks';
+
export default function PostTitleEdit( {
attributes: { level, levelOptions, textAlign, isLink, rel, linkTarget },
setAttributes,
@@ -66,6 +76,7 @@ export default function PostTitleEdit( {
} ),
} );
const blockEditingMode = useBlockEditingMode();
+ const dropdownMenuProps = useToolsPanelDropdownMenuProps();
let titleElement = { __( 'Title' ) };
@@ -138,41 +149,82 @@ export default function PostTitleEdit( {
/>
-
- {
+ setAttributes( {
+ isLink: false,
+ linkTarget: '_self',
+ rel: '',
+ } );
+ } }
+ dropdownMenuProps={ dropdownMenuProps }
+ >
+ isLink }
label={ __( 'Make title a link' ) }
- onChange={ () =>
- setAttributes( { isLink: ! isLink } )
+ onDeselect={ () =>
+ setAttributes( { isLink: false } )
}
- checked={ isLink }
- />
+ isShownByDefault
+ >
+
+ setAttributes( { isLink: ! isLink } )
+ }
+ checked={ isLink }
+ />
+
{ isLink && (
<>
-
+ linkTarget !== '_self'
+ }
label={ __( 'Open in new tab' ) }
- onChange={ ( value ) =>
+ onDeselect={ () =>
setAttributes( {
- linkTarget: value
- ? '_blank'
- : '_self',
+ linkTarget: '_self',
} )
}
- checked={ linkTarget === '_blank' }
- />
-
+
+ setAttributes( {
+ linkTarget: value
+ ? '_blank'
+ : '_self',
+ } )
+ }
+ checked={ linkTarget === '_blank' }
+ />
+
+ !! rel }
label={ __( 'Link rel' ) }
- value={ rel }
- onChange={ ( newRel ) =>
- setAttributes( { rel: newRel } )
+ onDeselect={ () =>
+ setAttributes( { rel: '' } )
}
- />
+ isShownByDefault
+ >
+
+ setAttributes( { rel: newRel } )
+ }
+ />
+
>
) }
-
+
>
) }