Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Editor: Remove inline toolbar preference #58945

Merged
merged 1 commit into from
Feb 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 7 additions & 10 deletions packages/block-editor/src/components/observe-typing/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -115,11 +115,10 @@ export function useMouseMoveTypingReset() {
* field, presses ESC or TAB, or moves the mouse in the document.
*/
export function useTypingObserver() {
const { isTyping, hasInlineToolbar } = useSelect( ( select ) => {
const { isTyping: _isTyping, getSettings } = select( blockEditorStore );
const { isTyping } = useSelect( ( select ) => {
const { isTyping: _isTyping } = select( blockEditorStore );
return {
isTyping: _isTyping(),
hasInlineToolbar: getSettings().hasInlineToolbar,
};
}, [] );
const { startTyping, stopTyping } = useDispatch( blockEditorStore );
Expand Down Expand Up @@ -183,12 +182,10 @@ export function useTypingObserver() {
node.addEventListener( 'focus', stopTypingOnNonTextField );
node.addEventListener( 'keydown', stopTypingOnEscapeKey );

if ( ! hasInlineToolbar ) {
ownerDocument.addEventListener(
'selectionchange',
stopTypingOnSelectionUncollapse
);
}
ownerDocument.addEventListener(
'selectionchange',
stopTypingOnSelectionUncollapse
);

return () => {
defaultView.clearTimeout( timerId );
Expand Down Expand Up @@ -245,7 +242,7 @@ export function useTypingObserver() {
node.removeEventListener( 'keydown', startTypingInTextField );
};
},
[ isTyping, hasInlineToolbar, startTyping, stopTyping ]
[ isTyping, startTyping, stopTyping ]
);

return useMergeRefs( [ ref1, ref2 ] );
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,36 +3,13 @@
*/
import { __ } from '@wordpress/i18n';
import { Popover, ToolbarGroup } from '@wordpress/components';
import { useSelect } from '@wordpress/data';
import {
isCollapsed,
getActiveFormats,
useAnchor,
store as richTextStore,
} from '@wordpress/rich-text';

/**
* Internal dependencies
*/
import BlockControls from '../block-controls';
import FormatToolbar from './format-toolbar';
import NavigableToolbar from '../navigable-toolbar';
import { store as blockEditorStore } from '../../store';

function InlineSelectionToolbar( { editableContentElement, activeFormats } ) {
const lastFormat = activeFormats[ activeFormats.length - 1 ];
const lastFormatType = lastFormat?.type;
const settings = useSelect(
( select ) => select( richTextStore ).getFormatType( lastFormatType ),
[ lastFormatType ]
);
const popoverAnchor = useAnchor( {
editableContentElement,
settings,
} );

return <InlineToolbar popoverAnchor={ popoverAnchor } />;
}

function InlineToolbar( { popoverAnchor } ) {
return (
Expand All @@ -56,35 +33,11 @@ function InlineToolbar( { popoverAnchor } ) {
);
}

const FormatToolbarContainer = ( {
inline,
editableContentElement,
value,
} ) => {
const hasInlineToolbar = useSelect(
( select ) => select( blockEditorStore ).getSettings().hasInlineToolbar,
[]
);

const FormatToolbarContainer = ( { inline, editableContentElement } ) => {
if ( inline ) {
return <InlineToolbar popoverAnchor={ editableContentElement } />;
}

if ( hasInlineToolbar ) {
const activeFormats = getActiveFormats( value );

if ( isCollapsed( value ) && ! activeFormats.length ) {
return null;
}

return (
<InlineSelectionToolbar
editableContentElement={ editableContentElement }
activeFormats={ activeFormats }
/>
);
}

// Render regular toolbar.
return (
<BlockControls group="inline">
Expand Down
1 change: 0 additions & 1 deletion packages/block-editor/src/components/rich-text/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -348,7 +348,6 @@ export function RichTextWrapper(
<FormatToolbarContainer
inline={ inlineToolbar }
editableContentElement={ anchorRef.current }
value={ value }
/>
) }
<TagName
Expand Down
71 changes: 33 additions & 38 deletions packages/edit-post/src/editor.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,44 +49,41 @@ function Editor( {
onNavigateToPreviousEntityRecord,
} = useNavigateToEntityRecord( initialPostId, initialPostType );

const { hasInlineToolbar, post, preferredStyleVariations, template } =
useSelect(
( select ) => {
const { isFeatureActive, getEditedPostTemplate } =
select( editPostStore );
const { getEntityRecord, getPostType, canUser } =
select( coreStore );
const { getEditorSettings } = select( editorStore );
const { post, preferredStyleVariations, template } = useSelect(
( select ) => {
const { getEditedPostTemplate } = select( editPostStore );
const { getEntityRecord, getPostType, canUser } =
select( coreStore );
const { getEditorSettings } = select( editorStore );

const postObject = getEntityRecord(
'postType',
currentPost.postType,
currentPost.postId
);
const postObject = getEntityRecord(
'postType',
currentPost.postType,
currentPost.postId
);

const supportsTemplateMode =
getEditorSettings().supportsTemplateMode;
const isViewable =
getPostType( currentPost.postType )?.viewable ?? false;
const canEditTemplate = canUser( 'create', 'templates' );
return {
hasInlineToolbar: isFeatureActive( 'inlineToolbar' ),
preferredStyleVariations: select( preferencesStore ).get(
'core/edit-post',
'preferredStyleVariations'
),
template:
supportsTemplateMode &&
isViewable &&
canEditTemplate &&
currentPost.postType !== 'wp_template'
? getEditedPostTemplate()
: null,
post: postObject,
};
},
[ currentPost.postType, currentPost.postId ]
);
const supportsTemplateMode =
getEditorSettings().supportsTemplateMode;
const isViewable =
getPostType( currentPost.postType )?.viewable ?? false;
const canEditTemplate = canUser( 'create', 'templates' );
return {
preferredStyleVariations: select( preferencesStore ).get(
'core/edit-post',
'preferredStyleVariations'
),
template:
supportsTemplateMode &&
isViewable &&
canEditTemplate &&
currentPost.postType !== 'wp_template'
? getEditedPostTemplate()
: null,
post: postObject,
};
},
[ currentPost.postType, currentPost.postId ]
);

const { updatePreferredStyleVariations } = useDispatch( editPostStore );

Expand All @@ -100,11 +97,9 @@ function Editor( {
value: preferredStyleVariations,
onChange: updatePreferredStyleVariations,
},
hasInlineToolbar,
} ),
[
settings,
hasInlineToolbar,
preferredStyleVariations,
updatePreferredStyleVariations,
onNavigateToEntityRecord,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,6 @@ const BLOCK_EDITOR_SETTINGS = [
'gradients',
'generateAnchors',
'onNavigateToEntityRecord',
'hasInlineToolbar',
'imageDefaultSize',
'imageDimensions',
'imageEditing',
Expand Down
Loading