refactor(input-autocomplete): refactoring (#918)

core-ds · Nov 3, 2023 · 09af9f9 · 09af9f9
1 parent d270e14
commit 09af9f9
Show file tree

Hide file tree

Showing 38 changed files with 632 additions and 1,292 deletions.
diff --git a/.changeset/clever-snakes-turn.md b/.changeset/clever-snakes-turn.md
@@ -0,0 +1,22 @@
+---
+'@alfalab/core-components-input-autocomplete': major
+---
+
+- Мобильный компонент приведен в соответствие с десктопным, теперь оба компонента имеют одинаковый список пропсов, за некоторым исключением.
+- Удалены пропы onFilter, filter, onClearFilter и др, которые раньше использовались только в мобильном компоненте
+
+## Миграция с предыдущей версии
+Из мобильного компонента удалено дополнительное состояние для фильтра,
+соответственно были удалены пропы onFilter, filter, onClearFilter.
+Теперь при открытии шторки в инпут будет попадать состояние, переданное через проп value, как и у десктопного компонента,
+а при вводе значения в инпут будет вызываться коллбэк onInput. При нажатии кнопок "Отмена" и "Продолжить" также будет вызываться onInput.
+После апдейта нужно заменить
+```jsx
+<InputAutocompeteMobile onFilter={onFilter} filter={filter} value={value} />
+```
+на
+```jsx
+<InputAutocompeteMobile onInput={onFilter} value={value} />
+```
+
+Примеры можете посмотреть в нашем [сторибуке](https://core-ds.github.io/core-components/master/?path=/docs/inputautocomplete--docs)
diff --git a/.changeset/giant-avocados-guess.md b/.changeset/giant-avocados-guess.md
@@ -0,0 +1,6 @@
+---
+'@alfalab/core-components-select': minor
+---
+
+- В searchProps добавлена возможность прокинуть кастомную функцию фильтрации
+- Фокус в поле поиска устанавливается после вызова transitionProps.onEntered, а не по таймауту как раньше
diff --git a/packages/base-modal/src/Component.tsx b/packages/base-modal/src/Component.tsx
@@ -333,15 +333,15 @@ export const BaseModal = forwardRef<HTMLDivElement, BaseModalProps>(
             if (hasHeader) {
                 setHeaderHighlighted(
                     !isScrolledToTop(scrollableNodeRef.current) &&
-                        componentNodeRef.current.getBoundingClientRect().top - headerOffset <= 0,
+                        componentNodeRef.current.getBoundingClientRect().top - headerOffset <= 1,
                 );
             }
 
             if (hasFooter) {
                 setFooterHighlighted(
                     !isScrolledToBottom(scrollableNodeRef.current) &&
                         componentNodeRef.current.getBoundingClientRect().bottom >=
-                            window.innerHeight,
+                            window.innerHeight - 1,
                 );
             }
         }, [hasFooter, hasHeader, headerOffset]);

diff --git a/packages/input-autocomplete/package.json b/packages/input-autocomplete/package.json
@@ -14,12 +14,12 @@
         "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
     },
     "dependencies": {
-        "@alfalab/core-components-button": "^9.1.0",
         "@alfalab/core-components-form-control": "^10.2.0",
         "@alfalab/core-components-input": "^12.3.0",
         "@alfalab/core-components-popover": "^6.1.0",
         "@alfalab/core-components-select": "^15.3.0",
         "@alfalab/core-components-shared": "^0.7.0",
+        "@alfalab/core-components-mq": "^4.2.0",
         "@alfalab/hooks": "^1.13.0",
         "classnames": "^2.3.1",
         "lodash.throttle": "^4.1.1",

diff --git a/packages/input-autocomplete/src/Component.desktop.tsx b/packages/input-autocomplete/src/Component.desktop.tsx
@@ -1,59 +1,18 @@
-import React, { ChangeEvent, FC, forwardRef, RefAttributes } from 'react';
+import React, { forwardRef } from 'react';
 
-import { InputProps } from '@alfalab/core-components-input';
 import { Popover } from '@alfalab/core-components-popover';
 import {
     AnyObject,
     BaseSelect,
-    BaseSelectProps,
     Optgroup as DefaultOptgroup,
     Option as DefaultOption,
     OptionsList as DefaultOptionsList,
 } from '@alfalab/core-components-select/shared';
 
 import { AutocompleteField } from './autocomplete-field';
+import { InputAutocompleteCommonProps } from './types';
 
-export type InputAutocompleteDesktopProps = Omit<
-    BaseSelectProps,
-    'Field' | 'nativeSelect' | 'searchProps' | 'showSearch' | 'Search'
-> & {
-    /**
-     * Компонент ввода значения
-     */
-    Input?: FC<InputProps & RefAttributes<HTMLInputElement>>;
-
-    /**
-     * Пропсы, которые будут прокинуты в инпут
-     */
-    inputProps?: InputProps & Record<string, unknown>;
-
-    /**
-     * Значение поля ввода
-     */
-    value?: string;
-
-    /**
-     * Поле доступно только для чтения
-     */
-    readOnly?: InputProps['readOnly'];
-
-    /**
-     * Отображение иконки успеха
-     */
-    success?: boolean;
-
-    /**
-     * Обработчик ввода
-     */
-    onInput?: (event: ChangeEvent<HTMLInputElement>) => void;
-
-    /**
-     * Хранит функцию, с помощью которой можно обновить положение поповера
-     */
-    updatePopover?: BaseSelectProps['updatePopover'];
-};
-
-export const InputAutocompleteDesktop = forwardRef<HTMLInputElement, InputAutocompleteDesktopProps>(
+export const InputAutocompleteDesktop = forwardRef<HTMLInputElement, InputAutocompleteCommonProps>(
     (
         {
             OptionsList = DefaultOptionsList,