@alfalab/core-components 42.5.1 → 42.7.0

package/input-autocomplete/modern/Component.mobile.js

@@ -6,7 +6,7 @@ import { ButtonMobile } from '../../button/modern/mobile';
 import { Input } from '../../input/modern';
 import { SelectMobile } from '../../select/modern/mobile';
 import { AutocompleteMobileField } from './autocomplete-mobile-field/Component.js';
-import { s as styles } from './mobile.module-698d1199.js';
+import { s as styles } from './mobile.module-f3a5d2f8.js';
 import '../../form-control/modern/mobile';
 import '@alfalab/hooks';
 

package/input-autocomplete/modern/Component.modal.mobile.d.ts

@@ -2,7 +2,7 @@
 import React from 'react';
 import { ChangeEvent, ElementType } from "react";
 import { ButtonMobileProps } from "./mobile-96988a65";
-import { SelectModalMobileProps } from "./mobile-ade26e99";
+import { SelectModalMobileProps } from "./mobile-45dc17c6";
 import { BaseSelectChangePayload } from "./shared-4cd3936b";
 type InputAutocompleteModalMobileProps = Omit<SelectModalMobileProps, 'OptionsList' | 'Checkmark' | 'onScroll' | 'nativeSelect' | 'autocomplete' | 'valueRenderer'> & {
     /**
@@ -46,7 +46,7 @@ type InputAutocompleteModalMobileProps = Omit<SelectModalMobileProps, 'OptionsLi
      */
     Input?: ElementType;
 };
-declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<Omit<SelectModalMobileProps, "onScroll" | "valueRenderer" | "autocomplete" | "nativeSelect" | "OptionsList" | "Checkmark"> & {
+declare const InputAutocompleteModalMobile: React.ForwardRefExoticComponent<Omit<SelectModalMobileProps, "onScroll" | "valueRenderer" | "Checkmark" | "autocomplete" | "nativeSelect" | "OptionsList"> & {
     /**
      * Обработчик выбора
      */

package/input-autocomplete/modern/Component.modal.mobile.js

@@ -6,7 +6,7 @@ import { ButtonMobile } from '../../button/modern/mobile';
 import { Input } from '../../input/modern';
 import { SelectModalMobile } from '../../select/modern/mobile';
 import { AutocompleteMobileField } from './autocomplete-mobile-field/Component.js';
-import { s as styles } from './mobile.module-698d1199.js';
+import { s as styles } from './mobile.module-f3a5d2f8.js';
 import '../../form-control/modern/mobile';
 import '@alfalab/hooks';
 

package/input-autocomplete/modern/Component.responsive.d.ts

@@ -26,7 +26,7 @@ declare const InputAutocompleteResponsive: React.ForwardRefExoticComponent<Omit<
     success?: boolean | undefined;
     onInput?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;
     updatePopover?: React.MutableRefObject<() => void> | undefined;
-} & Omit<BaseSelectProps, "onScroll" | "valueRenderer" | "autocomplete" | "nativeSelect" | "OptionsList" | "Checkmark"> & {
+} & Omit<BaseSelectProps, "onScroll" | "valueRenderer" | "Checkmark" | "autocomplete" | "nativeSelect" | "OptionsList"> & {
     onChange: (payload: string | import("./shared-4cd3936b").BaseSelectChangePayload) => void;
     onFilter: (event: React.ChangeEvent<HTMLInputElement>) => void;
     value?: string | undefined;

package/input-autocomplete/modern/Component.responsive.js

@@ -13,7 +13,7 @@ import '../../input/modern';
 import '../../select/modern/mobile';
 import './autocomplete-mobile-field/Component.js';
 import '../../form-control/modern/mobile';
-import './mobile.module-698d1199.js';
+import './mobile.module-f3a5d2f8.js';
 
 const InputAutocompleteResponsive = forwardRef(({ breakpoint = 1024, ...restProps }, ref) => {
     const [view] = useMedia([

package/input-autocomplete/modern/autocomplete-field/Component.js

@@ -3,7 +3,7 @@ import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { InputDesktop } from '../../../input/modern/desktop';
 
-const styles = {"arrow":"input-autocomplete__arrow_1j74k","error":"input-autocomplete__error_1j74k"};
+const styles = {"arrow":"input-autocomplete__arrow_1gs19","error":"input-autocomplete__error_1gs19"};
 require('./index.css');
 
 const AutocompleteField = ({ label, labelView = 'inner', placeholder, size, Arrow, Input = InputDesktop, value, error, success, hint, disabled, readOnly, onInput, inputProps = {}, innerProps, }) => {

package/input-autocomplete/modern/autocomplete-field/index.css

@@ -1,4 +1,4 @@
-/* hash: 1okxh */
-.input-autocomplete__arrow_1j74k.input-autocomplete__error_1j74k ~ * {
+/* hash: 1t0l6 */
+.input-autocomplete__arrow_1gs19.input-autocomplete__error_1gs19 ~ * {
     display: none;
 }

package/input-autocomplete/modern/autocomplete-mobile-field/Component.js

@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { FormControlMobile } from '../../../form-control/modern/mobile';
 import { useFocus } from '@alfalab/hooks';
 
-const styles = {"component":"input-autocomplete__component_o9n8b","field":"input-autocomplete__field_o9n8b","disabled":"input-autocomplete__disabled_o9n8b","placeholder":"input-autocomplete__placeholder_o9n8b","contentWrapper":"input-autocomplete__contentWrapper_o9n8b","value":"input-autocomplete__value_o9n8b","focusVisible":"input-autocomplete__focusVisible_o9n8b"};
+const styles = {"component":"input-autocomplete__component_enkca","field":"input-autocomplete__field_enkca","disabled":"input-autocomplete__disabled_enkca","placeholder":"input-autocomplete__placeholder_enkca","contentWrapper":"input-autocomplete__contentWrapper_enkca","value":"input-autocomplete__value_enkca","focusVisible":"input-autocomplete__focusVisible_enkca"};
 require('./index.css');
 
 const AutocompleteMobileField = ({ size = 'm', open, disabled, value, innerProps, dataTestId, fieldClassName, labelView = 'inner', placeholder, Arrow, valueRenderer, toggleMenu, setSelectedItems, selectedMultiple, FormControlComponent, ...restProps }) => {

package/input-autocomplete/modern/autocomplete-mobile-field/index.css

@@ -1,4 +1,4 @@
-/* hash: 1nf4k */
+/* hash: 1izgu */
 :root {
 } /* deprecated */ :root {
     --color-light-border-link: #0072ef;
@@ -18,16 +18,16 @@
 } :root {
     --focus-color: var(--color-light-border-link);
     --disabled-cursor: not-allowed;
-} .input-autocomplete__component_o9n8b {
+} .input-autocomplete__component_enkca {
     width: 100%;
     outline: none;
-} .input-autocomplete__field_o9n8b:not(.input-autocomplete__disabled_o9n8b) {
+} .input-autocomplete__field_enkca:not(.input-autocomplete__disabled_enkca) {
     cursor: pointer;
-} .input-autocomplete__disabled_o9n8b {
+} .input-autocomplete__disabled_enkca {
     cursor: var(--disabled-cursor);
-} .input-autocomplete__placeholder_o9n8b {
+} .input-autocomplete__placeholder_enkca {
     color: var(--color-light-text-secondary);
-} .input-autocomplete__contentWrapper_o9n8b {
+} .input-autocomplete__contentWrapper_enkca {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -36,11 +36,11 @@
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%;
-} .input-autocomplete__value_o9n8b {
+} .input-autocomplete__value_enkca {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
-} .input-autocomplete__focusVisible_o9n8b {
+} .input-autocomplete__focusVisible_enkca {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }

package/input-autocomplete/modern/component-1a4fbd11.d.ts

@@ -0,0 +1,44 @@
+/// <reference types="react" />
+import React from "react";
+import { FC, ReactNode, RefObject } from "react";
+import { NavigationBarProps } from "./index-c76d6398";
+import { SwipeableHandlers } from "react-swipeable";
+import { BackdropProps } from "./index-ebda875c";
+import { BottomSheetProps } from "./types-b0ff398d";
+type FooterProps = {
+    /**
+     * Контент футера
+     */
+    children?: ReactNode;
+    /**
+     * Фиксирует футер
+     */
+    sticky?: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+};
+declare const Footer: FC<FooterProps>;
+type HeaderProps = Omit<NavigationBarProps, "view" | "size"> & {
+    headerRef: RefObject<HTMLDivElement>;
+    headerOffset: number;
+};
+declare const Header: FC<HeaderProps>;
+type SwipeableBackdropProps = BackdropProps & {
+    /**
+     * Прозрачность бэкдропа
+     */
+    opacity?: number;
+    /**
+     * Обработчики свайпа
+     */
+    handlers?: SwipeableHandlers;
+    /**
+     * Время анимации opacity
+     */
+    opacityTimeout?: number;
+};
+declare const SwipeableBackdrop: FC<SwipeableBackdropProps>;
+declare const BottomSheet: React.ForwardRefExoticComponent<BottomSheetProps & React.RefAttributes<HTMLDivElement>>;
+export { FooterProps, Footer, HeaderProps, Header, SwipeableBackdropProps, SwipeableBackdrop, BottomSheet };

package/input-autocomplete/modern/desktop-63dec22f.d.ts

@@ -1,6 +1,2 @@
-/// <reference types="react" />
-import React from "react";
-import { AnchorButtonProps, NativeButtonProps } from "./typings-9211a437";
-type ButtonDesktopProps = Partial<AnchorButtonProps | NativeButtonProps>;
-declare const ButtonDesktop: React.ForwardRefExoticComponent<ButtonDesktopProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-export { ButtonDesktopProps, ButtonDesktop };
+export * from "./Component.desktop-ebda875c";
+export {};

package/input-autocomplete/modern/hook-8abfea97.d.ts

@@ -51,9 +51,9 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
          */
         selectedDraft?: OptionShape[] | undefined;
         OptionsList?: import("react").FC<import("./typings-dd8ca091").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
-        Footer?: import("react").FC<import("./Component-dd8ca091").FooterProps> | undefined;
-        Header?: import("react").FC<import("./Component-ebda875c").HeaderProps> | undefined;
-        headerProps?: import("./Component-ebda875c").HeaderProps | undefined;
+        Footer?: import("react").FC<import("./Component-ebda875c").FooterProps> | undefined;
+        Header?: import("react").FC<import("./Component-aed0af6e").HeaderProps> | undefined;
+        headerProps?: import("./Component-aed0af6e").HeaderProps | undefined;
         showHeaderWithSelectAll?: boolean | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     optionsListProps: {
@@ -86,5 +86,5 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
         accessor?: ((option: OptionShape) => string) | undefined;
     } | undefined;
 };
-export * from "./Component-dd8ca091";
+export * from "./Component-ebda875c";
 export { UseSelectWithApplyProps, SELECT_ALL_KEY, useSelectWithApply };

package/input-autocomplete/modern/hook-ebda875c.d.ts

@@ -0,0 +1,48 @@
+/// <reference types="react" />
+import React from 'react';
+import { OptionProps, OptionShape } from "./typings-dd8ca091";
+type OptionsFetcherResponse = {
+    options: OptionShape[];
+    hasMore: boolean;
+};
+type useLazyLoadingProps = {
+    /** Количество элементов на "странице" */
+    limit?: number;
+    /** Начальный номер "страницы" */
+    initialOffset?: number;
+    /** Скелетон загружаемых элементов */
+    skeleton?: React.ReactNode;
+    /** Компонент пункта меню */
+    Option?: React.FC<OptionProps>;
+    /**
+     * Функция-загрузчик опций.
+     * @param offset - текущая страница
+     * @param limit - количество элементов на странице
+     * @param queryString - строчные данные, пробрасываемые для поиска из кастомного инпута, расположенного в заголовке OptionsList
+     * @returns Promise<{
+     *  options - список опций следующей "страницы". Они аппендятся к предыдущим
+     *  hasMore - указывает, есть ли еще незагруженные элементы (в случае false перестает загружать "следующую страницу")
+     * }>
+     */
+    optionsFetcher(offset: number, limit: number, queryString?: string): Promise<OptionsFetcherResponse>;
+};
+declare function useLazyLoading({ limit, initialOffset, optionsFetcher, skeleton, Option, }: useLazyLoadingProps): {
+    optionsProps: {
+        Option: (props: OptionProps) => React.JSX.Element;
+        options: OptionShape[];
+        optionsListProps: {
+            ref: React.RefObject<HTMLDivElement>;
+            inputProps: {
+                onChange: (event: React.ChangeEvent<HTMLInputElement>, payload: {
+                    value: string;
+                }) => void;
+                value: string;
+            };
+        };
+        onOpen: (payload: {
+            open?: boolean;
+        }) => void;
+    };
+    reset: () => void;
+};
+export { useLazyLoading };

package/input-autocomplete/modern/index-1a4fbd11.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import React from "react";
+import { PaddingType } from "./index-72dda473";
+declare const isClient: () => boolean;
+declare const getDataTestId: (dataTestId?: string, element?: string) => string | undefined;
+declare function createPaddingStyle(padding?: PaddingType): undefined | React.CSSProperties;
+declare function easeInOutQuad(x: number): number;
+declare const easingFns: {
+    easeInOutQuad: typeof easeInOutQuad;
+};
+declare function disableUserInput<T>(disabled: boolean | undefined, event: React.KeyboardEvent<T>): void;
+declare const inputUtils: {
+    disableUserInput: typeof disableUserInput;
+};
+/**
+ * Возвращает true, если значение равно null или undefined
+ */
+declare function isNil(value: unknown): boolean;
+declare const fnUtils: {
+    isNil: typeof isNil;
+};
+export { isClient, getDataTestId, createPaddingStyle, easingFns, inputUtils, fnUtils };

package/input-autocomplete/modern/index-bdb4c6b9.d.ts

@@ -1,2 +1,180 @@
-export * from "./Component-ebda875c";
-export * from "./utils-1574ad8b";
+/// <reference types="react" />
+/// <reference types="react-transition-group" />
+/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
+import React from "react";
+import { FC, KeyboardEvent, MouseEvent, MutableRefObject, ReactNode, Ref } from "react";
+import { TransitionProps } from "react-transition-group/Transition";
+import { BackdropProps, PortalProps } from "./index-ebda875c";
+type BaseModalProps = {
+    /**
+     * Контент
+     */
+    children?: ReactNode;
+    /**
+     * Компонент бэкдропа
+     */
+    Backdrop?: FC<BackdropProps>;
+    /**
+     * Свойства для Бэкдропа
+     */
+    backdropProps?: Partial<BackdropProps> & Record<string, unknown>;
+    /**
+     * Нода, компонент или функция возвращающая их
+     *
+     * Контейнер к которому будут добавляться порталы
+     */
+    container?: PortalProps["getPortalContainer"];
+    /**
+     * Отключает автоматический перевод фокуса на модалку при открытии
+     * @default false
+     */
+    disableAutoFocus?: boolean;
+    /**
+     * Отключает ловушку фокуса
+     * @default false
+     */
+    disableFocusLock?: boolean;
+    /**
+     * Отключает восстановление фокуса на предыдущем элементе после закрытия модалки
+     * @default false
+     */
+    disableRestoreFocus?: boolean;
+    /**
+     * Отключает вызов `callback` при нажатии Escape
+     * @default false
+     */
+    disableEscapeKeyDown?: boolean;
+    /**
+     * Отключает вызов `callback` при клике на бэкдроп
+     * @default false
+     */
+    disableBackdropClick?: boolean;
+    /**
+     * Отключает блокировку скролла при открытии модального окна
+     * @default false
+     */
+    disableBlockingScroll?: boolean;
+    /**
+     * Содержимое модалки всегда в DOM
+     * @default false
+     */
+    keepMounted?: boolean;
+    /**
+     * Управление видимостью модалки
+     */
+    open: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс
+     */
+    contentClassName?: string;
+    /**
+     * Дополнительные пропсы на обертку контента
+     */
+    contentProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+    /**
+     * Дополнительные пропсы на компонентную обертку контента
+     */
+    componentDivProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+    /**
+     * Дополнительный класс для обертки (Modal)
+     */
+    wrapperClassName?: string;
+    /**
+     * Обработчик скролла контента
+     */
+    scrollHandler?: "wrapper" | "content" | MutableRefObject<HTMLDivElement | null>;
+    /**
+     * Пропсы для анимации (CSSTransition)
+     */
+    transitionProps?: Partial<TransitionProps>;
+    /**
+     * Рендерить ли в контейнер через портал.
+     * @default true
+     */
+    usePortal?: boolean;
+    /**
+     * Обработчик события нажатия на бэкдроп
+     */
+    onBackdropClick?: (event: MouseEvent) => void;
+    /**
+     * Обработчик события нажатия на Escape
+     *
+     * Если `disableEscapeKeyDown` - false и модальное окно в фокусе
+     */
+    onEscapeKeyDown?: (event: KeyboardEvent) => void;
+    /**
+     * Обработчик закрытия
+     */
+    onClose?: (event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>, reason?: "backdropClick" | "escapeKeyDown" | "closerClick") => void;
+    /**
+     * Обработчик события onEntered компонента Transition
+     */
+    onMount?: () => void;
+    /**
+     * Обработчик события onExited компонента Transition
+     */
+    onUnmount?: () => void;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * z-index компонента
+     */
+    zIndex?: number;
+    /**
+     * Реф, который должен быть установлен компонентной области
+     */
+    componentRef?: MutableRefObject<HTMLDivElement | null>;
+};
+type BaseModalContext = {
+    parentRef: React.RefObject<HTMLDivElement>;
+    componentRef: React.RefObject<HTMLDivElement>;
+    hasFooter?: boolean;
+    hasHeader?: boolean;
+    hasScroll?: boolean;
+    headerHighlighted?: boolean;
+    footerHighlighted?: boolean;
+    headerOffset?: number;
+    setHeaderOffset: (offset: number) => void;
+    contentRef: Ref<HTMLElement>;
+    setHasHeader: (exists: boolean) => void;
+    setHasFooter: (exists: boolean) => void;
+    onClose: Required<BaseModalProps>["onClose"];
+};
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+declare const BaseModalContext: React.Context<BaseModalContext>;
+declare const BaseModal: React.ForwardRefExoticComponent<BaseModalProps & React.RefAttributes<HTMLDivElement>>;
+declare function isScrolledToTop(target: HTMLElement): boolean;
+declare function isScrolledToBottom(target: HTMLElement): boolean;
+declare function hasScrollbar(target: HTMLElement): boolean;
+declare const getScrollbarSize: () => number;
+declare const restoreContainerStyles: (container: HTMLElement) => void;
+declare const handleContainer: (container?: HTMLElement) => void;
+type SavedStyle = {
+    value: string;
+    key: string;
+    el: HTMLElement;
+};
+type RestoreStyle = {
+    container: HTMLElement;
+    modals: number;
+    styles: SavedStyle[];
+};
+declare class ModalStore {
+    private readonly restoreStyles;
+    constructor();
+    getRestoreStyles: () => RestoreStyle[];
+}
+declare const getModalStore: () => ModalStore;
+declare class GlobalStore {
+    private readonly modalStore;
+    constructor();
+    getModalStore: () => ModalStore;
+}
+export { BaseModalProps, BaseModalContext, BaseModal, isScrolledToTop, isScrolledToBottom, hasScrollbar, getScrollbarSize, restoreContainerStyles, handleContainer, getModalStore, GlobalStore };
+export type { SavedStyle };

package/input-autocomplete/modern/index-c76d6398.d.ts

@@ -1,2 +1,2 @@
-export * from "./Component-2abb571d";
+export * from "./Component-1a4fbd11";
 export type { NavigationBarProps } from "./types-83e2bd9e";