From 8987193d032e41e8835190a9e4e75524c9e268d8 Mon Sep 17 00:00:00 2001
From: Aleksandr Dyuzhikov <alex.duzh@gmail.com>
Date: Fri, 13 Dec 2024 12:48:06 +0300
Subject: [PATCH] fix(input): fix set selection range (#1488)

* fix(input): fix set selection range

* feat(input): refactor use effect

---------

Co-authored-by: Aleksandr Dyuzhikov <adyuzhikov@alfabank.ru>
---
 .changeset/weak-poems-fail.md                 |  5 +++++
 .../src/components/base-input/Component.tsx   | 21 ++++++++++++-------
 2 files changed, 19 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/weak-poems-fail.md

diff --git a/.changeset/weak-poems-fail.md b/.changeset/weak-poems-fail.md
new file mode 100644
index 0000000000..20fe43c21f
--- /dev/null
+++ b/.changeset/weak-poems-fail.md
@@ -0,0 +1,5 @@
+---
+'@alfalab/core-components-input': patch
+---
+
+Фикс вызова input.setSelectionRange
diff --git a/packages/input/src/components/base-input/Component.tsx b/packages/input/src/components/base-input/Component.tsx
index 23e243dd8d..5415a1fe69 100644
--- a/packages/input/src/components/base-input/Component.tsx
+++ b/packages/input/src/components/base-input/Component.tsx
@@ -221,6 +221,8 @@ const SIZE_TO_CLASSNAME_MAP = {
     72: 'size-72',
 };
 
+const inputTypesForSelectionRange = ['password', 'search', 'tel', 'text', 'url'];
+
 export const BaseInput = React.forwardRef<HTMLInputElement, BaseInputProps>(
     (
         {
@@ -284,14 +286,19 @@ export const BaseInput = React.forwardRef<HTMLInputElement, BaseInputProps>(
         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 input = inputRef.current;
+
+            if (
+                !restProps.autoFocus ||
+                !input ||
+                // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange
+                !inputTypesForSelectionRange.includes(input.type)
+            ) {
+                return;
             }
+
+            // https://github.com/facebook/react/issues/14125
+            input.setSelectionRange(input.value.length, input.value.length);
         }, []);
 
         const handleInputFocus = useCallback(