diff --git a/lib/compat/wordpress-6.2/script-loader.php b/lib/compat/wordpress-6.2/script-loader.php index e08bfa6e46ca8..aed58ef98122b 100644 --- a/lib/compat/wordpress-6.2/script-loader.php +++ b/lib/compat/wordpress-6.2/script-loader.php @@ -137,7 +137,8 @@ function gutenberg_resolve_assets_override() { 'block_editor_settings_all', function( $settings ) { // We must override what core is passing now. - $settings['__unstableResolvedAssets'] = gutenberg_resolve_assets_override(); + $settings['__unstableResolvedAssets'] = gutenberg_resolve_assets_override(); + $settings['__unstableIsBlockBasedTheme'] = wp_is_block_theme(); return $settings; }, 100 diff --git a/packages/block-library/src/freeform/edit.js b/packages/block-library/src/freeform/edit.js index ab9a2257f87e4..c41a78ca5c042 100644 --- a/packages/block-library/src/freeform/edit.js +++ b/packages/block-library/src/freeform/edit.js @@ -6,10 +6,10 @@ import { useBlockProps, store as blockEditorStore, } from '@wordpress/block-editor'; -import { debounce } from '@wordpress/compose'; +import { debounce, useRefEffect } from '@wordpress/compose'; import { useSelect } from '@wordpress/data'; import { ToolbarGroup } from '@wordpress/components'; -import { useEffect, useRef } from '@wordpress/element'; +import { useEffect, useRef, useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; import { BACKSPACE, DELETE, F10, isKeyboardEvent } from '@wordpress/keycodes'; @@ -17,6 +17,7 @@ import { BACKSPACE, DELETE, F10, isKeyboardEvent } from '@wordpress/keycodes'; * Internal dependencies */ import ConvertToBlocksButton from './convert-to-blocks-button'; +import ModalEdit from './modal'; const { wp } = window; @@ -36,17 +37,44 @@ function isTmceEmpty( editor ) { return /^\n?$/.test( body.innerText || body.textContent ); } -export default function ClassicEdit( { +export default function FreeformEdit( props ) { + const { clientId } = props; + const canRemove = useSelect( + ( select ) => select( blockEditorStore ).canRemoveBlock( clientId ), + [ clientId ] + ); + const [ isIframed, setIsIframed ] = useState( false ); + const ref = useRefEffect( ( element ) => { + setIsIframed( element.ownerDocument !== document ); + }, [] ); + + return ( + <> + { canRemove && ( + + + + + + ) } +
+ { isIframed ? ( + + ) : ( + + ) } +
+ + ); +} + +function ClassicEdit( { clientId, attributes: { content }, setAttributes, onReplace, } ) { const { getMultiSelectedBlockClientIds } = useSelect( blockEditorStore ); - const canRemove = useSelect( - ( select ) => select( blockEditorStore ).canRemoveBlock( clientId ), - [ clientId ] - ); const didMount = useRef( false ); useEffect( () => { @@ -225,28 +253,19 @@ export default function ClassicEdit( { /* eslint-disable jsx-a11y/no-static-element-interactions */ return ( <> - { canRemove && ( - - - - - - ) } -
-
-
-
+
+
); /* eslint-enable jsx-a11y/no-static-element-interactions */ diff --git a/packages/block-library/src/freeform/modal.js b/packages/block-library/src/freeform/modal.js new file mode 100644 index 0000000000000..67338be91fa86 --- /dev/null +++ b/packages/block-library/src/freeform/modal.js @@ -0,0 +1,111 @@ +/** + * WordPress dependencies + */ +import { BlockControls, store } from '@wordpress/block-editor'; +import { + ToolbarGroup, + ToolbarButton, + Modal, + Button, +} from '@wordpress/components'; +import { useEffect, useState, RawHTML } from '@wordpress/element'; +import { __ } from '@wordpress/i18n'; +import { useSelect } from '@wordpress/data'; + +function ClassicEdit( props ) { + const styles = useSelect( + ( select ) => select( store ).getSettings().styles + ); + useEffect( () => { + const { baseURL, suffix, settings } = window.wpEditorL10n.tinymce; + + window.tinymce.EditorManager.overrideDefaults( { + base_url: baseURL, + suffix, + } ); + + window.wp.oldEditor.initialize( props.id, { + tinymce: { + ...settings, + height: 500, + setup( editor ) { + editor.on( 'init', () => { + const doc = editor.getDoc(); + styles.forEach( ( { css } ) => { + const styleEl = doc.createElement( 'style' ); + styleEl.innerHTML = css; + doc.head.appendChild( styleEl ); + } ); + } ); + }, + }, + } ); + + return () => { + window.wp.oldEditor.remove( props.id ); + }; + }, [] ); + + return