From 0089d17bc936192a87ab204e9c3d2d5a502d9d7a Mon Sep 17 00:00:00 2001
From: Alex Yatsenko <reme3d2y@gmail.com>
Date: Mon, 14 Oct 2024 11:45:53 +0300
Subject: [PATCH] fix(input): set caret position at the end of the input
 programmatically

---
 .../input/src/components/base-input/Component.tsx   | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/packages/input/src/components/base-input/Component.tsx b/packages/input/src/components/base-input/Component.tsx
index 1dc0c3cee6..451217130d 100644
--- a/packages/input/src/components/base-input/Component.tsx
+++ b/packages/input/src/components/base-input/Component.tsx
@@ -18,7 +18,7 @@ import cn from 'classnames';
 import { FormControlProps } from '@alfalab/core-components-form-control';
 import { getDataTestId } from '@alfalab/core-components-shared';
 import { StatusBadge } from '@alfalab/core-components-status-badge';
-import { useFocus } from '@alfalab/hooks';
+import { useFocus, useLayoutEffect_SAFE_FOR_SSR } from '@alfalab/hooks';
 
 import { ClearButton } from '../clear-button';
 
@@ -283,6 +283,17 @@ export const BaseInput = React.forwardRef<HTMLInputElement, BaseInputProps>(
         const clearButtonVisible = clear && filled && !disabled && !readOnlyProp;
         const hasInnerLabel = label && labelView === 'inner';
 
+        useLayoutEffect_SAFE_FOR_SSR(() => {
+            // https://github.com/facebook/react/issues/14125
+            if (restProps.autoFocus) {
+                const input = inputRef.current;
+
+                if (input) {
+                    input.setSelectionRange(input.value.length, input.value.length);
+                }
+            }
+        }, []);
+
         const handleInputFocus = useCallback(
             (event: React.FocusEvent<HTMLInputElement>) => {
                 if (!readOnly) {