From a0856a1c84c207f6ec823b791ea055f1c3c0b02b Mon Sep 17 00:00:00 2001
From: Lukas Lieb <lukas.lieb@axonivy.com>
Date: Tue, 10 Dec 2024 08:56:58 +0100
Subject: [PATCH] Fix focus jumps at end of input field

---
 packages/editor/src/editor/sidebar/fields/InputField.tsx      | 4 ++--
 .../src/editor/sidebar/fields/InputFieldWithBrowser.tsx       | 4 ++--
 packages/editor/src/editor/sidebar/fields/NumberField.tsx     | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/editor/src/editor/sidebar/fields/InputField.tsx b/packages/editor/src/editor/sidebar/fields/InputField.tsx
index 39477907..b371de2e 100644
--- a/packages/editor/src/editor/sidebar/fields/InputField.tsx
+++ b/packages/editor/src/editor/sidebar/fields/InputField.tsx
@@ -1,4 +1,4 @@
-import { BasicField, Input, type MessageData } from '@axonivy/ui-components';
+import { BasicField, BasicInput, type MessageData } from '@axonivy/ui-components';
 import type { TextFieldOptions } from '../../../types/config';
 
 export type InputFieldProps = {
@@ -11,7 +11,7 @@ export type InputFieldProps = {
 
 export const InputField = ({ label, value, onChange, onBlur, message, options }: InputFieldProps & { options?: TextFieldOptions }) => (
   <BasicField label={label} message={message} className='badge-field' tabIndex={0}>
-    <Input
+    <BasicInput
       value={value}
       onChange={e => onChange(e.target.value)}
       onBlur={onBlur}
diff --git a/packages/editor/src/editor/sidebar/fields/InputFieldWithBrowser.tsx b/packages/editor/src/editor/sidebar/fields/InputFieldWithBrowser.tsx
index 1607287c..f4bd3e70 100644
--- a/packages/editor/src/editor/sidebar/fields/InputFieldWithBrowser.tsx
+++ b/packages/editor/src/editor/sidebar/fields/InputFieldWithBrowser.tsx
@@ -1,4 +1,4 @@
-import { BasicField, Button, Dialog, DialogContent, DialogTrigger, Input, InputBadge, InputGroup } from '@axonivy/ui-components';
+import { BasicField, BasicInput, Button, Dialog, DialogContent, DialogTrigger, InputBadge, InputGroup } from '@axonivy/ui-components';
 import { IvyIcons } from '@axonivy/ui-icons';
 import { useRef, useState } from 'react';
 import type { InputFieldProps } from './InputField';
@@ -30,7 +30,7 @@ export const InputFieldWithBrowser = ({
       <BasicField label={label} message={message} style={{ flex: '1' }} {...focusWithinProps} className='badge-field' tabIndex={0}>
         {isFocusWithin || cmsQuickFixPopoverRef.current ? (
           <InputGroup>
-            <Input
+            <BasicInput
               ref={inputRef}
               value={value}
               onChange={e => onChange(e.target.value)}
diff --git a/packages/editor/src/editor/sidebar/fields/NumberField.tsx b/packages/editor/src/editor/sidebar/fields/NumberField.tsx
index 1eb36bce..c92ad7ab 100644
--- a/packages/editor/src/editor/sidebar/fields/NumberField.tsx
+++ b/packages/editor/src/editor/sidebar/fields/NumberField.tsx
@@ -1,4 +1,4 @@
-import { Input, BasicField, type MessageData } from '@axonivy/ui-components';
+import { BasicField, type MessageData, BasicInput } from '@axonivy/ui-components';
 
 type InputFieldProps = {
   label: string;
@@ -9,6 +9,6 @@ type InputFieldProps = {
 
 export const NumberField = ({ label, value, onChange, message }: InputFieldProps) => (
   <BasicField label={label} message={message}>
-    <Input type='number' value={value} onChange={e => onChange(Number(e.target.value))} />
+    <BasicInput type='number' value={value} onChange={e => onChange(Number(e.target.value))} />
   </BasicField>
 );