From f462a1f5563a6bb18443091c16d75064f2b31bad Mon Sep 17 00:00:00 2001
From: Andrei Miron <andrei.miron@mcro-e.com>
Date: Thu, 19 Mar 2026 13:38:04 +0200
Subject: [PATCH] fix(graphing): adjust axis label PD-5595

---
 packages/graphing/src/axis/axes.jsx  | 16 +++++++++-------
 packages/graphing/src/grid-setup.jsx | 10 ++++++++++
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/packages/graphing/src/axis/axes.jsx b/packages/graphing/src/axis/axes.jsx
index fed4375f8..5df696680 100644
--- a/packages/graphing/src/axis/axes.jsx
+++ b/packages/graphing/src/axis/axes.jsx
@@ -25,19 +25,19 @@ const StyledArrow = styled(Arrow)(() => ({
   fill: color.defaults.PRIMARY,
 }));
 
-const StyledLabel = styled('div')(({ theme }) => ({
-  fontSize: theme.typography.fontSize,
-}));
 
-const StyledAxisLabelHolder = styled('div')(({ theme }) => ({
+const StyledAxisLabelHolder = styled('div')(({ theme, centered }) => ({
   padding: 0,
   margin: 0,
-  textAlign: 'center',
   '* > *': {
     margin: 0,
     padding: 0,
   },
+  '& p': {
+    margin: 0,
+  },
   fontSize: theme.typography.fontSize,
+  ...(centered && { textAlign: 'center' }),
 }));
 
 const StyledAxesGroup = styled('g')(() => ({
@@ -129,7 +129,9 @@ export class RawXAxis extends React.Component {
         {includeArrows && includeArrows.right && <StyledArrow direction="right" x={domain.max} y={0} scale={scale} />}
         {domain.axisLabel && (
           <foreignObject x={size.width + 17} y={scale.y(0) - 9} width={necessaryWidth} height={20 * necessaryRows}>
-            <StyledLabel dangerouslySetInnerHTML={{ __html: domain.axisLabel }} />
+            <Readable false>
+              <StyledAxisLabelHolder dangerouslySetInnerHTML={{ __html: domain.axisLabel }} />
+            </Readable>
           </foreignObject>
         )}
       </StyledAxesGroup>
@@ -186,7 +188,7 @@ export class RawYAxis extends React.Component {
         {range.axisLabel && (
           <foreignObject x={scale.x(0) - necessaryWidth / 2} y={-33} width={necessaryWidth} height="20">
             <Readable false>
-              <StyledAxisLabelHolder dangerouslySetInnerHTML={{ __html: range.axisLabel }} />
+              <StyledAxisLabelHolder centered dangerouslySetInnerHTML={{ __html: range.axisLabel }} />
             </Readable>
           </foreignObject>
         )}
diff --git a/packages/graphing/src/grid-setup.jsx b/packages/graphing/src/grid-setup.jsx
index c8029dfe8..178f10c57 100644
--- a/packages/graphing/src/grid-setup.jsx
+++ b/packages/graphing/src/grid-setup.jsx
@@ -118,6 +118,15 @@ const AxisConfig = (props) => {
   const { axisLabel = {}, min = {}, max = {} } = displayedFields;
   const activePlugins = ['bold', 'italic', 'underline', 'strikethrough'];
 
+  const onKeyDown = (event) => {
+    if (event.key === 'Enter') {
+      // prevent adding new lines - cancelling event
+      return true;
+    }
+
+    return false;
+  };
+
   return (
     <ColumnView>
       {displayHeader && (
@@ -159,6 +168,7 @@ const AxisConfig = (props) => {
                 onChange={(value) => onChange('axisLabel', value)}
                 markup={label || ''}
                 charactersLimit={5}
+                onKeyDown={onKeyDown}
                 activePlugins={activePlugins}
               />
             </AxisLabel>