From fba27725d146cc9aa8801950c16223becceef081 Mon Sep 17 00:00:00 2001
From: Andrew Serong <14988353+andrewserong@users.noreply.github.com>
Date: Wed, 30 Jun 2021 23:48:29 +1000
Subject: [PATCH] Box Control: Rename VerticalHorizontalInputControls to
 AxialInputControls (#33016)

---
 ...horizontal-input-controls.js => axial-input-controls.js} | 2 +-
 packages/components/src/box-control/index.js                | 6 ++----
 packages/components/src/box-control/stories/index.js        | 4 ++--
 3 files changed, 5 insertions(+), 7 deletions(-)
 rename packages/components/src/box-control/{vertical-horizontal-input-controls.js => axial-input-controls.js} (97%)

diff --git a/packages/components/src/box-control/vertical-horizontal-input-controls.js b/packages/components/src/box-control/axial-input-controls.js
similarity index 97%
rename from packages/components/src/box-control/vertical-horizontal-input-controls.js
rename to packages/components/src/box-control/axial-input-controls.js
index 6c7b5a9ad396e..f4b014e8f5e80 100644
--- a/packages/components/src/box-control/vertical-horizontal-input-controls.js
+++ b/packages/components/src/box-control/axial-input-controls.js
@@ -7,7 +7,7 @@ import { Layout } from './styles/box-control-styles';
 
 const groupedSides = [ 'vertical', 'horizontal' ];
 
-export default function VerticalHorizontalInputControls( {
+export default function AxialInputControls( {
 	onChange,
 	onFocus,
 	onHoverOn,
diff --git a/packages/components/src/box-control/index.js b/packages/components/src/box-control/index.js
index e651020069bbd..3f23a17d7ea47 100644
--- a/packages/components/src/box-control/index.js
+++ b/packages/components/src/box-control/index.js
@@ -17,7 +17,7 @@ import Button from '../button';
 import { FlexItem, FlexBlock } from '../flex';
 import AllInputControl from './all-input-control';
 import InputControls from './input-controls';
-import VerticalHorizontalInputControls from './vertical-horizontal-input-controls';
+import AxialInputControls from './axial-input-controls';
 import BoxControlIcon from './icon';
 import { Text } from '../text';
 import LinkedButton from './linked-button';
@@ -157,9 +157,7 @@ export default function BoxControl( {
 				) }
 				{ ! isLinked && splitOnAxis && (
 					<FlexBlock>
-						<VerticalHorizontalInputControls
-							{ ...inputControlProps }
-						/>
+						<AxialInputControls { ...inputControlProps } />
 					</FlexBlock>
 				) }
 				{ ! hasOneSide && (
diff --git a/packages/components/src/box-control/stories/index.js b/packages/components/src/box-control/stories/index.js
index f5ba9ee7bcbec..03f71885edb53 100644
--- a/packages/components/src/box-control/stories/index.js
+++ b/packages/components/src/box-control/stories/index.js
@@ -87,11 +87,11 @@ export const singleSide = () => {
 	);
 };
 
-export const verticalHorizontalControls = () => {
+export const axialControls = () => {
 	return <DemoExample splitOnAxis={ true } />;
 };
 
-export const verticalHorizontalControlsWithSingleSide = () => {
+export const axialControlsWithSingleSide = () => {
 	return (
 		<DemoExample
 			sides={ [ 'horizontal' ] }