diff --git a/packages/block-editor/src/components/media-placeholder/index.js b/packages/block-editor/src/components/media-placeholder/index.js index 7fb46d3ca9d56a..347cd3e42d130f 100644 --- a/packages/block-editor/src/components/media-placeholder/index.js +++ b/packages/block-editor/src/components/media-placeholder/index.js @@ -60,28 +60,37 @@ const InsertFromURLPopover = ( { ); -const URLSelectionUI = ( { - isURLInputVisible, - src, - onChangeSrc, - onSubmitSrc, - openURLInput, - closeURLInput, -} ) => { +const URLSelectionUI = ( { src, onChangeSrc, onSelectURL } ) => { // Use internal state instead of a ref to make sure that the component // re-renders when the popover's anchor updates. const [ popoverAnchor, setPopoverAnchor ] = useState( null ); + const [ isURLInputVisible, setIsURLInputVisible ] = useState( false ); + + const openURLInput = () => { + setIsURLInputVisible( true ); + }; + const closeURLInput = () => { + setIsURLInputVisible( false ); + popoverAnchor?.focus(); + }; + + const onSubmitSrc = ( event ) => { + event.preventDefault(); + if ( src && onSelectURL ) { + onSelectURL( src ); + closeURLInput(); + } + }; return ( -