Apply __next40pxDefaultSize to TextControl and Button component in re…

…naming UIs (#56933) * Apply __next40pxDefaultSize to TextControl in renaming UIs * Apply __next40pxDefaultSize to Button in renaming UIs
WordPress · Dec 11, 2023 · 70bc49f · 70bc49f · github-actions · Dec 11, 2023
1 parent 7358f66
commit 70bc49f
Show file tree

Hide file tree

Showing 7 changed files with 47 additions and 7 deletions.
diff --git a/packages/block-editor/src/components/block-rename/modal.js b/packages/block-editor/src/components/block-rename/modal.js
@@ -88,6 +88,7 @@ export default function BlockRenameModal( {
  <VStack spacing="3">
  <TextControl
  __nextHasNoMarginBottom
+ __next40pxDefaultSize
  value={ editedBlockName }
  label={ __( 'Block name' ) }
  hideLabelFromVision={ true }
@@ -96,11 +97,16 @@ export default function BlockRenameModal( {
  onFocus={ autoSelectInputText }
  />
  <HStack justify="right">
- <Button variant="tertiary" onClick={ onClose }>
+ <Button
+ __next40pxDefaultSize
+ variant="tertiary"
+ onClick={ onClose }
+ >
  { __( 'Cancel' ) }
  </Button>
 
  <Button
+ __next40pxDefaultSize
  aria-disabled={ ! isNameValid }
  variant="primary"
  type="submit"

diff --git a/packages/block-editor/src/hooks/block-renaming.js b/packages/block-editor/src/hooks/block-renaming.js
@@ -50,6 +50,7 @@ function BlockRenameControlPure( { metadata, setAttributes } ) {
  <InspectorControls group="advanced">
  <TextControl
  __nextHasNoMarginBottom
+ __next40pxDefaultSize
  label={ __( 'Block name' ) }
  value={ metadata?.name || '' }
  onChange={ ( newName ) => {

diff --git a/packages/edit-site/src/components/page-patterns/rename-menu-item.js b/packages/edit-site/src/components/page-patterns/rename-menu-item.js
@@ -96,6 +96,7 @@ export default function RenameMenuItem( { item, onClose } ) {
  <VStack spacing="5">
  <TextControl
  __nextHasNoMarginBottom
+ __next40pxDefaultSize
  label={ __( 'Name' ) }
  value={ title }
  onChange={ setTitle }
@@ -104,6 +105,7 @@ export default function RenameMenuItem( { item, onClose } ) {
 
  <HStack justify="right">
  <Button
+ __next40pxDefaultSize
  variant="tertiary"
  onClick={ () => {
  setIsModalOpen( false );
@@ -113,7 +115,11 @@ export default function RenameMenuItem( { item, onClose } ) {
  { __( 'Cancel' ) }
  </Button>
 
- <Button variant="primary" type="submit">
+ <Button
+ __next40pxDefaultSize
+ variant="primary"
+ type="submit"
+ >
  { __( 'Save' ) }
  </Button>
  </HStack>

diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menu/rename-modal.js b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menu/rename-modal.js
@@ -27,16 +27,22 @@ export default function RenameModal( { menuTitle, onClose, onSave } ) {
  <VStack spacing="3">
  <TextControl
  __nextHasNoMarginBottom
+ __next40pxDefaultSize
  value={ editedMenuTitle }
  placeholder={ __( 'Navigation title' ) }
  onChange={ setEditedMenuTitle }
  />
  <HStack justify="right">
- <Button variant="tertiary" onClick={ onClose }>
+ <Button
+ __next40pxDefaultSize
+ variant="tertiary"
+ onClick={ onClose }
+ >
  { __( 'Cancel' ) }
  </Button>
 
  <Button
+ __next40pxDefaultSize
  disabled={ ! isEditedMenuTitleValid }
  variant="primary"
  type="submit"

diff --git a/packages/edit-site/src/components/template-actions/rename-menu-item.js b/packages/edit-site/src/components/template-actions/rename-menu-item.js
@@ -107,6 +107,7 @@ export default function RenameMenuItem( { template, onClose } ) {
  <VStack spacing="5">
  <TextControl
  __nextHasNoMarginBottom
+ __next40pxDefaultSize
  label={ __( 'Name' ) }
  value={ editedTitle }
  onChange={ setEditedTitle }
@@ -115,6 +116,7 @@ export default function RenameMenuItem( { template, onClose } ) {
 
  <HStack justify="right">
  <Button
+ __next40pxDefaultSize
  variant="tertiary"
  onClick={ () => {
  setIsModalOpen( false );
@@ -123,7 +125,11 @@ export default function RenameMenuItem( { template, onClose } ) {
  { __( 'Cancel' ) }
  </Button>
 
- <Button variant="primary" type="submit">
+ <Button
+ __next40pxDefaultSize
+ variant="primary"
+ type="submit"
+ >
  { __( 'Save' ) }
  </Button>
  </HStack>

diff --git a/packages/patterns/src/components/rename-pattern-category-modal.js b/packages/patterns/src/components/rename-pattern-category-modal.js
@@ -138,6 +138,7 @@ export default function RenamePatternCategoryModal( {
  <TextControl
  ref={ textControlRef }
  __nextHasNoMarginBottom
+ __next40pxDefaultSize
  label={ __( 'Name' ) }
  value={ name }
  onChange={ onChange }
@@ -154,10 +155,15 @@ export default function RenamePatternCategoryModal( {
  ) }
  </VStack>
  <HStack justify="right">
- <Button variant="tertiary" onClick={ onRequestClose }>
+ <Button
+ __next40pxDefaultSize
+ variant="tertiary"
+ onClick={ onRequestClose }
+ >
  { __( 'Cancel' ) }
  </Button>
  <Button
+ __next40pxDefaultSize
  variant="primary"
  type="submit"
  aria-disabled={

diff --git a/packages/patterns/src/components/rename-pattern-modal.js b/packages/patterns/src/components/rename-pattern-modal.js
@@ -93,18 +93,27 @@ export default function RenamePatternModal( {
  <VStack spacing="5">
  <TextControl
  __nextHasNoMarginBottom
+ __next40pxDefaultSize
  label={ __( 'Name' ) }
  value={ name }
  onChange={ setName }
  required
  />
 
  <HStack justify="right">
- <Button variant="tertiary" onClick={ onRequestClose }>
+ <Button
+ __next40pxDefaultSize
+ variant="tertiary"
+ onClick={ onRequestClose }
+ >
  { __( 'Cancel' ) }
  </Button>
 
- <Button variant="primary" type="submit">
+ <Button
+ __next40pxDefaultSize
+ variant="primary"
+ type="submit"
+ >
  { __( 'Save' ) }
  </Button>
  </HStack>