From 50de63302be063c02d7aa437180598f53211324a Mon Sep 17 00:00:00 2001
From: Jakub Balhar <jakub.balhar@broadcom.com>
Date: Thu, 25 Jun 2026 08:34:39 +0200
Subject: [PATCH 1/2] =?UTF-8?q?fix:=20Replace=20Input=20with=20outlined=20?=
 =?UTF-8?q?TextField=20in=20WizardInputs=20=E2=80=94=20GH#4752?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Wizard/WizardComponents/WizardInputs.jsx  | 26 +++++++++++--------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx b/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx
index b8b834f0c9..6613071cba 100644
--- a/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx
+++ b/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx
@@ -18,6 +18,7 @@ import {
     MenuItem,
     Select,
     Input,
+    TextField,
     Tooltip,
 } from '@material-ui/core';
 import DeleteIcon from '@material-ui/icons/Delete';
@@ -444,17 +445,20 @@ class WizardInputs extends Component {
         const captionId = `my-helper${itemKey}`;
         return (
             <Tooltip className="wizardTooltip" title={finalTooltip}>
-                <FormControl className="wizardFormFields" disabled={disabled}>
-                    <InputLabel shrink>{question}</InputLabel>
-                    <Input
-                        id={itemKey}
-                        name={itemKey}
-                        value={value}
-                        onChange={(event) => this.handleInputChange(event, index)}
-                        aria-describedby={captionId}
-                    />
-                    <FormHelperText id={captionId}>{caption}</FormHelperText>
-                </FormControl>
+                <TextField
+                    variant="outlined"
+                    fullWidth
+                    className="wizardFormFields"
+                    label={question}
+                    value={value}
+                    onChange={(event) => this.handleInputChange(event, index)}
+                    helperText={caption}
+                    disabled={disabled}
+                    InputLabelProps={{ shrink: true }}
+                    id={itemKey}
+                    name={itemKey}
+                    FormHelperTextProps={{ id: captionId }}
+                />
             </Tooltip>
         );
     }

From a5752239d9e118739267460fd3103a7d645d3629 Mon Sep 17 00:00:00 2001
From: Jakub Balhar <jakub@balhar.net>
Date: Thu, 25 Jun 2026 10:10:14 +0200
Subject: [PATCH 2/2] Remove unused FormHelperText import

Removed unused FormHelperText import from WizardInputs.jsx

Signed-off-by: Jakub Balhar <jakub@balhar.net>
---
 .../src/components/Wizard/WizardComponents/WizardInputs.jsx      | 1 -
 1 file changed, 1 deletion(-)

diff --git a/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx b/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx
index 6613071cba..5e987b803b 100644
--- a/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx
+++ b/api-catalog-ui/frontend/src/components/Wizard/WizardComponents/WizardInputs.jsx
@@ -13,7 +13,6 @@ import {
     Checkbox,
     FormControl,
     FormControlLabel,
-    FormHelperText,
     InputLabel,
     MenuItem,
     Select,