diff --git a/packages/block-editor/src/components/block-card/index.js b/packages/block-editor/src/components/block-card/index.js
index cdf52ee7df0311..988dcfb2216b2a 100644
--- a/packages/block-editor/src/components/block-card/index.js
+++ b/packages/block-editor/src/components/block-card/index.js
@@ -14,9 +14,8 @@ import {
privateApis as componentsPrivateApis,
} from '@wordpress/components';
import { chevronLeft, chevronRight } from '@wordpress/icons';
-import { __, _x, isRTL, sprintf } from '@wordpress/i18n';
+import { __, isRTL } from '@wordpress/i18n';
import { useSelect, useDispatch } from '@wordpress/data';
-import { createInterpolateElement } from '@wordpress/element';
/**
* Internal dependencies
@@ -71,25 +70,10 @@ function BlockCard( { title, icon, description, blockType, className, name } ) {
- { name?.length
- ? createInterpolateElement(
- sprintf(
- // translators: 1: Custom block name. 2: Block title.
- _x(
- '%1$s %2$s',
- 'block label'
- ),
- name,
- title
- ),
- {
- span: (
-
- ),
- badge: ,
- }
- )
- : title }
+
+ { !! name?.length ? name : title }
+
+ { !! name?.length && { title } }
{ description && (
diff --git a/packages/block-editor/src/components/block-card/style.scss b/packages/block-editor/src/components/block-card/style.scss
index b02310fb630f4f..a5cb675597908b 100644
--- a/packages/block-editor/src/components/block-card/style.scss
+++ b/packages/block-editor/src/components/block-card/style.scss
@@ -16,10 +16,13 @@
font-size: $default-font-size;
line-height: $default-line-height;
margin: 0;
- padding: 3px 0; // This makes the title as high as the icon.
}
}
+.block-editor-block-card__name {
+ padding: 3px 0; // This makes the title as high as the icon.
+}
+
.block-editor-block-card .block-editor-block-icon {
flex: 0 0 $button-size-small;
margin-left: 0;