From d03c51cb5938f2634016ce4e2151ad9fd5d2e08e Mon Sep 17 00:00:00 2001 From: Jorge Date: Thu, 2 Jan 2020 18:34:36 +0000 Subject: [PATCH] Make UX closer to navigation block --- packages/block-library/src/button/edit.js | 49 ++++++++++++++++++++++- 1 file changed, 47 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/button/edit.js b/packages/block-library/src/button/edit.js index d1192014f0b358..fbf2510a06bed6 100644 --- a/packages/block-library/src/button/edit.js +++ b/packages/block-library/src/button/edit.js @@ -10,18 +10,24 @@ import { escape } from 'lodash'; import { __ } from '@wordpress/i18n'; import { useCallback, + useEffect, + useState, } from '@wordpress/element'; import { compose, } from '@wordpress/compose'; import { + KeyboardShortcuts, PanelBody, RangeControl, TextControl, ToggleControl, withFallbackStyles, + ToolbarButton, + ToolbarGroup, } from '@wordpress/components'; import { + BlockControls, __experimentalUseGradient, ContrastChecker, InspectorControls, @@ -37,6 +43,8 @@ import { DOWN, BACKSPACE, ENTER, + rawShortcut, + displayShortcut, } from '@wordpress/keycodes'; const { getComputedStyle } = window; @@ -94,7 +102,19 @@ const handleLinkControlOnKeyPress = ( event ) => { }; function URLPicker( { isSelected, url, title, setAttributes, opensInNewTab, onToggleOpenInNewTab } ) { - return isSelected ? ( + const [ isURLPickerOpen, setIsURLPickerOpen ] = useState( false ); + useEffect( + () => { + if ( ! isSelected ) { + setIsURLPickerOpen( false ); + } + }, + [ isSelected ] + ); + const openLinkControl = () => { + setIsURLPickerOpen( true ); + }; + const linkControl = isURLPickerOpen && ( { + setIsURLPickerOpen( false ); + } } /> - ) : null; + ); + return ( + <> + + + + + + + { linkControl } + + ); } function ButtonEdit( {