Skip to content

Commit

Permalink
Remove placeholder of default paragraph when it's the only block and …
Browse files Browse the repository at this point in the history
…canvas is zoomed out (#68106)

* remove the placeholder text of and disable the default paragraph block, in zoom out mode

* leave the block enabled

* update the custom placeholder data attribute


Co-authored-by: draganescu <andraganescu@git.wordpress.org>
Co-authored-by: talldan <talldanwp@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>
Co-authored-by: getdave <get_dave@git.wordpress.org>
Co-authored-by: richtabor <richtabor@git.wordpress.org>
Co-authored-by: colorful-tones <colorful-tones@git.wordpress.org>
Co-authored-by: ndiego <ndiego@git.wordpress.org>
Co-authored-by: andrewserong <andrewserong@git.wordpress.org>
  • Loading branch information
9 people authored Dec 20, 2024
1 parent d472c16 commit 6cbb0a7
Showing 1 changed file with 18 additions and 4 deletions.
22 changes: 18 additions & 4 deletions packages/block-library/src/paragraph/edit.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,14 +20,16 @@ import {
useBlockProps,
useSettings,
useBlockEditingMode,
store as blockEditorStore,
} from '@wordpress/block-editor';
import { useSelect } from '@wordpress/data';
import { getBlockSupport } from '@wordpress/blocks';
import { formatLtr } from '@wordpress/icons';

/**
* Internal dependencies
*/
import { useOnEnter } from './use-enter';
import { unlock } from '../lock-unlock';

function ParagraphRTLControl( { direction, setDirection } ) {
return (
Expand Down Expand Up @@ -109,7 +111,11 @@ function ParagraphBlock( {
isSelected: isSingleSelected,
name,
} ) {
const { align, content, direction, dropCap, placeholder } = attributes;
const isZoomOut = useSelect( ( select ) =>
unlock( select( blockEditorStore ) ).isZoomOut()
);

const { align, content, direction, dropCap } = attributes;
const blockProps = useBlockProps( {
ref: useOnEnter( { clientId, content } ),
className: clsx( {
Expand All @@ -119,6 +125,12 @@ function ParagraphBlock( {
style: { direction },
} );
const blockEditingMode = useBlockEditingMode();
let { placeholder } = attributes;
if ( isZoomOut ) {
placeholder = '';
} else if ( ! placeholder ) {
placeholder = __( 'Type / to choose a block' );
}

return (
<>
Expand Down Expand Up @@ -170,8 +182,10 @@ function ParagraphBlock( {
: __( 'Block: Paragraph' )
}
data-empty={ RichText.isEmpty( content ) }
placeholder={ placeholder || __( 'Type / to choose a block' ) }
data-custom-placeholder={ placeholder ? true : undefined }
placeholder={ placeholder }
data-custom-placeholder={
placeholder && ! isZoomOut ? true : undefined
}
__unstableEmbedURLOnPaste
__unstableAllowPrefixTransformations
/>
Expand Down

1 comment on commit 6cbb0a7

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flaky tests detected in 6cbb0a7.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/12433436280
📝 Reported issues:

Please sign in to comment.