prep build 1/9

bph · Jan 9, 2025 · eb7250e · eb7250e
2 parents 9ffe5bb + e746a95
commit eb7250e
Show file tree

Hide file tree

Showing 9 changed files with 60 additions and 61 deletions.
diff --git a/...ponents/block-card/stories/index.story.js → ...ponents/block-icon/stories/index.story.js b/...ponents/block-card/stories/index.story.js → ...ponents/block-icon/stories/index.story.js
@@ -6,35 +6,21 @@ import { box, button, cog, paragraph } from '@wordpress/icons';
 /**
  * Internal dependencies
  */
-import BlockCard from '../';
+import BlockIcon from '../';
 
 const meta = {
-	title: 'BlockEditor/BlockCard',
-	component: BlockCard,
+	title: 'BlockEditor/BlockIcon',
+	component: BlockIcon,
 	parameters: {
 		docs: {
 			description: {
 				component:
-					'The `BlockCard` component allows to display a "card" which contains the title of a block, its icon and its description.',
+					'The `BlockIcon` component allows to display an icon for a block.',
 			},
 			canvas: { sourceState: 'shown' },
 		},
 	},
 	argTypes: {
-		title: {
-			control: 'text',
-			description: 'The title of the block.',
-			table: {
-				type: { summary: 'string' },
-			},
-		},
-		description: {
-			control: 'text',
-			description: 'A description of the block functionality.',
-			table: {
-				type: { summary: 'string' },
-			},
-		},
 		icon: {
 			control: 'select',
 			options: [ 'paragraph', 'cog', 'box', 'button' ],
@@ -50,16 +36,23 @@ const meta = {
 				type: { summary: 'string | object' },
 			},
 		},
-		name: {
+		showColors: {
+			control: 'boolean',
+			description: 'Whether to show background and foreground colors.',
+			table: {
+				type: { summary: 'boolean' },
+			},
+		},
+		className: {
 			control: 'text',
-			description: 'Optional custom name for the block.',
+			description: 'Additional CSS class for the icon.',
 			table: {
 				type: { summary: 'string' },
 			},
 		},
-		className: {
+		context: {
 			control: 'text',
-			description: 'Additional CSS class names.',
+			description: 'Context where the icon is being used.',
 			table: {
 				type: { summary: 'string' },
 			},
@@ -71,9 +64,6 @@ export default meta;
 
 export const Default = {
 	args: {
-		title: 'Paragraph',
-		icon: paragraph,
-		description: 'This is a paragraph block description.',
-		name: 'Paragraph Block',
+		icon: 'paragraph',
 	},
 };
diff --git a/packages/block-editor/src/components/global-styles/image-settings-panel.js b/packages/block-editor/src/components/global-styles/image-settings-panel.js
@@ -61,14 +61,14 @@ export default function ImageSettingsPanel( {
 					// "RESET" button ONLY when the user has explicitly set a value in the
 					// Global Styles.
 					hasValue={ () => !! value?.lightbox }
-					label={ __( 'Expand on click' ) }
+					label={ __( 'Enlarge on click' ) }
 					onDeselect={ resetLightbox }
 					isShownByDefault
 					panelId={ panelId }
 				>
 					<ToggleControl
 						__nextHasNoMarginBottom
-						label={ __( 'Expand on click' ) }
+						label={ __( 'Enlarge on click' ) }
 						checked={ lightboxChecked }
 						onChange={ onChangeLightbox }
 					/>

diff --git a/packages/block-editor/src/components/url-popover/image-url-input-ui.js b/packages/block-editor/src/components/url-popover/image-url-input-ui.js
@@ -265,14 +265,14 @@ const ImageURLInputUI = ( {
 				<div className="block-editor-url-popover__expand-on-click">
 					<Icon icon={ fullscreen } />
 					<div className="text">
-						<p>{ __( 'Expand on click' ) }</p>
+						<p>{ __( 'Enlarge on click' ) }</p>
 						<p className="description">
 							{ __( 'Scales the image with a lightbox effect' ) }
 						</p>
 					</div>
 					<Button
 						icon={ linkOff }
-						label={ __( 'Disable expand on click' ) }
+						label={ __( 'Disable enlarge on click' ) }
 						onClick={ () => {
 							onSetLightbox?.( false );
 						} }
@@ -372,7 +372,7 @@ const ImageURLInputUI = ( {
 											stopEditLink();
 										} }
 									>
-										{ __( 'Expand on click' ) }
+										{ __( 'Enlarge on click' ) }
 									</MenuItem>
 								) }
 							</NavigableMenu>

diff --git a/packages/block-library/src/file/edit.js b/packages/block-library/src/file/edit.js
@@ -255,11 +255,12 @@ function FileEdit( { attributes, isSelected, setAttributes, clientId } ) {
 			<div { ...blockProps }>
 				{ displayPreviewInEditor && (
 					<ResizableBox
-						size={ { height: previewHeight } }
+						size={ { height: previewHeight, width: '100%' } }
 						minHeight={ MIN_PREVIEW_HEIGHT }
 						maxHeight={ MAX_PREVIEW_HEIGHT }
-						minWidth="100%"
-						grid={ [ 10, 10 ] }
+						// The horizontal grid value must be 1 or else the width may snap during a
+						// resize even though only vertical resizing is enabled.
+						grid={ [ 1, 10 ] }
 						enable={ {
 							top: false,
 							right: false,

diff --git a/packages/block-library/src/gallery/edit.js b/packages/block-library/src/gallery/edit.js
@@ -80,7 +80,7 @@ const LINK_OPTIONS = [
 	},
 	{
 		icon: fullscreen,
-		label: __( 'Expand on click' ),
+		label: __( 'Enlarge on click' ),
 		value: LINK_DESTINATION_LIGHTBOX,
 		noticeText: __( 'Lightbox effect' ),
 		infoText: __( 'Scale images with a lightbox effect' ),

diff --git a/packages/block-library/src/image/index.php b/packages/block-library/src/image/index.php
@@ -149,18 +149,14 @@ function block_core_image_render_lightbox( $block_content, $block ) {
 		return $block_content;
 	}
 
-	$alt              = $p->get_attribute( 'alt' );
-	$img_uploaded_src = $p->get_attribute( 'src' );
-	$img_class_names  = $p->get_attribute( 'class' );
-	$img_styles       = $p->get_attribute( 'style' );
-	$img_width        = 'none';
-	$img_height       = 'none';
-	$aria_label       = __( 'Enlarge image' );
-
-	if ( $alt ) {
-		/* translators: %s: Image alt text. */
-		$aria_label = sprintf( __( 'Enlarge image: %s' ), $alt );
-	}
+	$alt               = $p->get_attribute( 'alt' );
+	$img_uploaded_src  = $p->get_attribute( 'src' );
+	$img_class_names   = $p->get_attribute( 'class' );
+	$img_styles        = $p->get_attribute( 'style' );
+	$img_width         = 'none';
+	$img_height        = 'none';
+	$aria_label        = __( 'Enlarge' );
+	$dialog_aria_label = __( 'Enlarged image' );
 
 	if ( isset( $block['attrs']['id'] ) ) {
 		$img_uploaded_src = wp_get_attachment_url( $block['attrs']['id'] );
@@ -190,7 +186,7 @@ function block_core_image_render_lightbox( $block_content, $block ) {
 					'targetWidth'      => $img_width,
 					'targetHeight'     => $img_height,
 					'scaleAttr'        => $block['attrs']['scale'] ?? false,
-					'ariaLabel'        => $aria_label,
+					'ariaLabel'        => $dialog_aria_label,
 					'alt'              => $alt,
 				),
 			),

diff --git a/packages/eslint-plugin/rules/__tests__/valid-sprintf.js b/packages/eslint-plugin/rules/__tests__/valid-sprintf.js
@@ -71,6 +71,18 @@ sprintf(
 		{
 			code: `sprintf( '%(greeting)s %(toWhom)s', 'Hello', 'World' )`,
 		},
+		{
+			code: `sprintf( 'Rotated at %d %% degrees', 90 )`,
+		},
+		{
+			code: `sprintf( 'Rotated at %d%% degrees', 90 )`,
+		},
+		{
+			code: `sprintf( __( 'Rotated at %d%% degrees' ), 90 )`,
+		},
+		{
+			code: `sprintf( 'Rotated at %1$d %% degrees, %2$d %% angles', 90, 180 )`,
+		},
 	],
 	invalid: [
 		{

diff --git a/packages/eslint-plugin/utils/constants.js b/packages/eslint-plugin/utils/constants.js
@@ -37,13 +37,13 @@ const TRANSLATION_FUNCTIONS = new Set( [ '__', '_x', '_n', '_nx' ] );
  * @type {RegExp}
  */
 const REGEXP_SPRINTF_PLACEHOLDER =
-	/%(((\d+)\$)|(\(([$_a-zA-Z][$_a-zA-Z0-9]*)\)))?[ +0#-]*\d*(\.(\d+|\*))?(ll|[lhqL])?([cduxXefgsp%])/g;
-//               ▲         ▲                    ▲       ▲  ▲            ▲           ▲ type
-//               │         │                    │       │  │            └ Length (unsupported)
-//               │         │                    │       │  └ Precision / max width
-//               │         │                    │       └ Min width (unsupported)
-//               │         │                    └ Flags (unsupported)
-//               └ Index   └ Name (for named arguments)
+	/(?<!%)%(((\d+)\$)|(\(([$_a-zA-Z][$_a-zA-Z0-9]*)\)))?[ +0#-]*\d*(\.(\d+|\*))?(ll|[lhqL])?([cduxXefgsp])/g;
+//               	  ▲         ▲                    ▲       ▲  ▲            ▲           ▲ type
+//               	  │         │                    │       │  │            └ Length (unsupported)
+//               	  │         │                    │       │  └ Precision / max width
+//               	  │         │                    │       └ Min width (unsupported)
+//               	  │         │                    └ Flags (unsupported)
+//               	  └ Index   └ Name (for named arguments)
 
 /**
  * "Unordered" means there's no position specifier: '%s', not '%2$s'.

diff --git a/test/e2e/specs/editor/blocks/image.spec.js b/test/e2e/specs/editor/blocks/image.spec.js
@@ -859,17 +859,17 @@ test.describe( 'Image', () => {
 			} )
 		).toBeFocused();
 
-		// Select "Expand on click", then remove it.
+		// Select "Enlarge on click", then remove it.
 		await pageUtils.pressKeys( 'Tab' );
 		await page.keyboard.press( 'Enter' );
 		await pageUtils.pressKeys( 'Tab', { times: 5 } );
 		await expect(
-			page.getByRole( 'menuitem', { name: 'Expand on click' } )
+			page.getByRole( 'menuitem', { name: 'Enlarge on click' } )
 		).toBeFocused();
 		await page.keyboard.press( 'Enter' );
 		await expect(
 			page.getByRole( 'button', {
-				name: 'Disable expand on click',
+				name: 'Disable enlarge on click',
 			} )
 		).toBeFocused();
 		await page.keyboard.press( 'Enter' );
@@ -933,7 +933,7 @@ test.describe( 'Image - lightbox', () => {
 
 				await expect(
 					page.getByRole( 'menuitem', {
-						name: 'Expand on click',
+						name: 'Enlarge on click',
 					} )
 				).toBeHidden();
 			} );
@@ -958,13 +958,13 @@ test.describe( 'Image - lightbox', () => {
 
 				await page
 					.getByRole( 'button', {
-						name: 'Disable expand on click',
+						name: 'Disable enlarge on click',
 					} )
 					.click();
 
 				await expect(
 					page.getByRole( 'menuitem', {
-						name: 'Expand on click',
+						name: 'Enlarge on click',
 					} )
 				).toBeHidden();
 			} );