Components: FontSizePicker: Adjust Select Button sizing (#19479)

WordPress · Jan 29, 2020 · 167bd70 · 167bd70
1 parent c2eece7
commit 167bd70
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 10 deletions.
diff --git a/packages/components/src/custom-select-control/index.js b/packages/components/src/custom-select-control/index.js
@@ -29,9 +29,9 @@ const stateReducer = (
  return {
  selectedItem:
  items[
- selectedItem ?
- Math.min( items.indexOf( selectedItem ) + 1, items.length - 1 ) :
- 0
+ selectedItem
+ ? Math.min( items.indexOf( selectedItem ) + 1, items.length - 1 )
+ : 0
  ],
  };
  case useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:
@@ -40,9 +40,9 @@ const stateReducer = (
  return {
  selectedItem:
  items[
- selectedItem ?
- Math.max( items.indexOf( selectedItem ) - 1, 0 ) :
- items.length - 1
+ selectedItem
+ ? Math.max( items.indexOf( selectedItem ) - 1, 0 )
+ : items.length - 1
  ],
  };
  default:
@@ -73,6 +73,7 @@ export default function CustomSelectControl( {
  selectedItem: _selectedItem,
  stateReducer,
  } );
+
  const menuProps = getMenuProps( {
  className: 'components-custom-select-control__menu',
  } );
@@ -103,6 +104,7 @@ export default function CustomSelectControl( {
  'aria-label': label,
  'aria-labelledby': undefined,
  className: 'components-custom-select-control__button',
+ isSmall: true,
  } ) }
  >
  { itemToString( selectedItem ) }

diff --git a/storybook/test/__snapshots__/index.js.snap b/storybook/test/__snapshots__/index.js.snap
@@ -2554,7 +2554,7 @@ exports[`Storyshots Components/CustomSelectControl Default 1`] = `
  aria-expanded={false}
  aria-haspopup="listbox"
  aria-label="Font Size"
- className="components-button components-custom-select-control__button"
+ className="components-button components-custom-select-control__button is-small"
  id="downshift-null-toggle-button"
  onClick={[Function]}
  onKeyDown={[Function]}
@@ -3092,7 +3092,7 @@ exports[`Storyshots Components/FontSizePicker Default 1`] = `
  aria-expanded={false}
  aria-haspopup="listbox"
  aria-label="Preset Size"
- className="components-button components-custom-select-control__button"
+ className="components-button components-custom-select-control__button is-small"
  id="downshift-null-toggle-button"
  onClick={[Function]}
  onKeyDown={[Function]}
@@ -3180,7 +3180,7 @@ exports[`Storyshots Components/FontSizePicker With Slider 1`] = `
  aria-expanded={false}
  aria-haspopup="listbox"
  aria-label="Preset Size"
- className="components-button components-custom-select-control__button"
+ className="components-button components-custom-select-control__button is-small"
  id="downshift-null-toggle-button"
  onClick={[Function]}
  onKeyDown={[Function]}
@@ -3312,7 +3312,7 @@ exports[`Storyshots Components/FontSizePicker Without Custom Sizes 1`] = `
  aria-expanded={false}
  aria-haspopup="listbox"
  aria-label="Preset Size"
- className="components-button components-custom-select-control__button"
+ className="components-button components-custom-select-control__button is-small"
  id="downshift-null-toggle-button"
  onClick={[Function]}
  onKeyDown={[Function]}