@alfalab/core-components 42.0.0-beta.0 → 42.0.0-beta.1

package/tabs/modern/components/tabs/Component.collapsible.mobile.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { CollapsiblePrimaryTabListMobile } from '../primary-tablist/Component.collapsible.mobile.js';
+import { Tabs } from './Component.js';
+import 'classnames';
+import '../../../../badge/modern';
+import '../../../../keyboard-focusable/modern';
+import '../../../../picker-button/modern/desktop';
+import '../../../../mq/modern';
+import '@juggle/resize-observer';
+import '@alfalab/hooks';
+import '../../../../shared/modern';
+import '../title/Component.js';
+import '../../index.module-cd918b29.js';
+import '../../mobile.module-823710bb.js';
+import '../primary-tablist/Component.collapsible.js';
+import '../../hooks/use-tablist-titles.js';
+import '../../hooks/use-collapsible-elements.js';
+import '../../hooks/use-tabs.js';
+import '../../synthetic-events.js';
+
+const TabsCollapsibleMobile = ({ ...restProps }) => (React.createElement(Tabs, { TabList: CollapsiblePrimaryTabListMobile, ...restProps }));
+
+export { TabsCollapsibleMobile };

package/tabs/modern/components/tabs/Component.collapsible.responsive.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { TabsProps } from "../../typings";
+type TabsCollapsibleResponsiveProps = Omit<TabsProps, 'TabList' | 'scrollable' | 'view'>;
+declare const TabsCollapsibleResponsive: ({ ...restProps }: TabsCollapsibleResponsiveProps) => JSX.Element;
+export { TabsCollapsibleResponsiveProps, TabsCollapsibleResponsive };

package/tabs/modern/components/tabs/Component.collapsible.responsive.js

@@ -0,0 +1,25 @@
+import React from 'react';
+import { CollapsiblePrimaryTabListResponsive } from '../primary-tablist/Component.collapsible.responsive.js';
+import { Tabs } from './Component.js';
+import '../../../../mq/modern';
+import 'classnames';
+import '../../../../badge/modern';
+import '../../../../keyboard-focusable/modern';
+import '../../../../picker-button/modern/desktop';
+import '@juggle/resize-observer';
+import '@alfalab/hooks';
+import '../../../../shared/modern';
+import '../title/Component.js';
+import '../../index.module-cd918b29.js';
+import '../primary-tablist/Component.collapsible.mobile.js';
+import '../../mobile.module-823710bb.js';
+import '../primary-tablist/Component.collapsible.desktop.js';
+import '../primary-tablist/Component.collapsible.js';
+import '../../hooks/use-tablist-titles.js';
+import '../../hooks/use-collapsible-elements.js';
+import '../../hooks/use-tabs.js';
+import '../../synthetic-events.js';
+
+const TabsCollapsibleResponsive = ({ ...restProps }) => (React.createElement(Tabs, { TabList: CollapsiblePrimaryTabListResponsive, ...restProps }));
+
+export { TabsCollapsibleResponsive };

package/tabs/modern/components/tabs/Component.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-declare const Tabs: ({ TabList, className, containerClassName, size, defaultMatch, children, selectedId, scrollable, collapsible, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, }: Omit<TabsProps, 'view'>) => JSX.Element;
+declare const Tabs: ({ TabList, className, containerClassName, size, defaultMatchMediaValue, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, }: Omit<TabsProps, 'view'>) => JSX.Element;
 export { Tabs };

package/tabs/modern/components/tabs/Component.desktop.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-type TabsDesktopProps = Omit<TabsProps, 'TabList' | 'fullWidthScroll'>;
+type TabsDesktopProps = Omit<TabsProps, 'TabList' | 'fullWidthScroll' | 'collapsedTabsIds'>;
 declare const TabsDesktop: ({ view, scrollable, size, ...restProps }: TabsDesktopProps) => JSX.Element;
 export { TabsDesktopProps, TabsDesktop };

package/tabs/modern/components/tabs/Component.desktop.js

@@ -3,22 +3,16 @@ import { PrimaryTabListDesktop } from '../primary-tablist/Component.desktop.js';
 import { SecondaryTabListDesktop } from '../secondary-tablist/Component.desktop.js';
 import { Tabs } from './Component.js';
 import 'classnames';
-import '../../../../badge/modern';
 import '../../../../keyboard-focusable/modern';
-import '../../../../picker-button/modern/desktop';
-import '@alfalab/hooks';
-import '@juggle/resize-observer';
+import '../../../../shared/modern';
 import '../scrollable-container/Component.js';
 import '../title/Component.js';
 import 'compute-scroll-into-view';
-import '../../index.module-58709150.js';
+import '../../index.module-cd918b29.js';
 import '../../../../tag/modern';
-import '../../index.module-50ec9b7a.js';
+import '../../index.module-71e56d00.js';
 import '../primary-tablist/Component.js';
-import '../../hooks/use-tablist-titles.js';
-import '../../hooks/use-collapsible-elements.js';
 import '../../hooks/use-tabs.js';
-import '../../synthetic-events.js';
 import '../secondary-tablist/Component.js';
 
 const views = {

package/tabs/modern/components/tabs/Component.js

@@ -1,6 +1,6 @@
 import React, { cloneElement } from 'react';
 
-const Tabs = ({ TabList, className, containerClassName, size, defaultMatch, children, selectedId, scrollable, collapsible, collapsedTabsIds, fullWidthScroll = false, keepMounted = false, dataTestId, onChange, }) => {
+const Tabs = ({ TabList, className, containerClassName, size, defaultMatchMediaValue, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll = false, keepMounted = false, dataTestId, onChange, }) => {
     const tabsArray = React.Children.toArray(children);
     const titles = tabsArray.map(({ props: { title, id, rightAddons, disabled, hidden, toggleClassName, dataTestId: toggleTestId, }, }) => ({
         title,
@@ -13,7 +13,7 @@ const Tabs = ({ TabList, className, containerClassName, size, defaultMatch, chil
     }));
     const tabs = tabsArray.filter((tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted);
     return (React.createElement("div", { className: className },
-        React.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsible: collapsible, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatch: defaultMatch, fullWidthScroll: fullWidthScroll }),
+        React.createElement(TabList, { containerClassName: containerClassName, size: size, titles: titles, selectedId: selectedId, scrollable: scrollable, collapsedTabsIds: collapsedTabsIds, onChange: onChange, dataTestId: dataTestId, defaultMatchMediaValue: defaultMatchMediaValue, fullWidthScroll: fullWidthScroll }),
         tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))));
 };
 

package/tabs/modern/components/tabs/Component.mobile.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-type TabsMobileProps = Omit<TabsProps, 'TabList' | 'size' | 'collapsible' | 'collapsedTabsIds'>;
+type TabsMobileProps = Omit<TabsProps, 'TabList' | 'size' | 'collapsedTabsIds'>;
 declare const TabsMobile: ({ view, scrollable, ...restProps }: TabsMobileProps) => JSX.Element;
 export { TabsMobileProps, TabsMobile };

package/tabs/modern/components/tabs/Component.mobile.js

@@ -3,22 +3,17 @@ import { PrimaryTabListMobile } from '../primary-tablist/Component.mobile.js';
 import { SecondaryTabListMobile } from '../secondary-tablist/Component.mobile.js';
 import { Tabs } from './Component.js';
 import 'classnames';
-import '../../../../badge/modern';
 import '../../../../keyboard-focusable/modern';
-import '../../../../picker-button/modern/desktop';
-import '@alfalab/hooks';
-import '@juggle/resize-observer';
+import '../../../../shared/modern';
 import '../scrollable-container/Component.js';
 import '../title/Component.js';
 import 'compute-scroll-into-view';
-import '../../index.module-58709150.js';
+import '../../index.module-cd918b29.js';
+import '../../mobile.module-823710bb.js';
 import '../../../../tag/modern';
-import '../../index.module-50ec9b7a.js';
+import '../../index.module-71e56d00.js';
 import '../primary-tablist/Component.js';
-import '../../hooks/use-tablist-titles.js';
-import '../../hooks/use-collapsible-elements.js';
 import '../../hooks/use-tabs.js';
-import '../../synthetic-events.js';
 import '../secondary-tablist/Component.js';
 
 const views = {

package/tabs/modern/components/tabs/Component.responsive.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { TabsProps } from "../../typings";
-type TabsResponsiveProps = Omit<TabsProps, 'TabList'>;
+type TabsResponsiveProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;
 declare const TabsResponsive: ({ view, scrollable, ...restProps }: TabsResponsiveProps) => JSX.Element;
 export { TabsResponsiveProps, TabsResponsive };

package/tabs/modern/components/tabs/Component.responsive.js

@@ -2,26 +2,22 @@ import React from 'react';
 import { PrimaryTabListResponsive } from '../primary-tablist/Component.responsive.js';
 import { SecondaryTabListResponsive } from '../secondary-tablist/Component.responsive.js';
 import { Tabs } from './Component.js';
-import '@alfalab/hooks';
+import '../../../../mq/modern';
 import 'classnames';
-import '../../../../badge/modern';
 import '../../../../keyboard-focusable/modern';
-import '../../../../picker-button/modern/desktop';
-import '@juggle/resize-observer';
+import '../../../../shared/modern';
 import '../scrollable-container/Component.js';
 import '../title/Component.js';
 import 'compute-scroll-into-view';
-import '../../index.module-58709150.js';
+import '../../index.module-cd918b29.js';
 import '../primary-tablist/Component.mobile.js';
+import '../../mobile.module-823710bb.js';
 import '../../../../tag/modern';
-import '../../index.module-50ec9b7a.js';
+import '../../index.module-71e56d00.js';
 import '../secondary-tablist/Component.mobile.js';
 import '../primary-tablist/Component.desktop.js';
 import '../primary-tablist/Component.js';
-import '../../hooks/use-tablist-titles.js';
-import '../../hooks/use-collapsible-elements.js';
 import '../../hooks/use-tabs.js';
-import '../../synthetic-events.js';
 import '../secondary-tablist/Component.desktop.js';
 import '../secondary-tablist/Component.js';
 

package/tabs/modern/desktop.d.ts

@@ -1,8 +1,4 @@
 export * from "./components/primary-tablist/Component.desktop";
-export * from "./components/scrollable-container/index";
 export * from "./components/secondary-tablist/Component.desktop";
 export * from "./components/tab/index";
 export * from "./components/tabs/Component.desktop";
-export * from "./hooks/use-tabs";
-export * from "./hooks/use-collapsible-elements";
-export * from "./typings";

package/tabs/modern/desktop.js

@@ -1,24 +1,18 @@
 export { PrimaryTabListDesktop } from './components/primary-tablist/Component.desktop.js';
-export { ScrollableContainer } from './components/scrollable-container/Component.js';
 export { SecondaryTabListDesktop } from './components/secondary-tablist/Component.desktop.js';
 export { Tab } from './components/tab/Component.js';
 export { TabsDesktop } from './components/tabs/Component.desktop.js';
-export { useTabs } from './hooks/use-tabs.js';
-export { useCollapsibleElements } from './hooks/use-collapsible-elements.js';
 import 'react';
 import 'classnames';
-import '../../badge/modern';
 import '../../keyboard-focusable/modern';
-import '../../picker-button/modern/desktop';
-import '@alfalab/hooks';
-import '@juggle/resize-observer';
+import '../../shared/modern';
+import './components/scrollable-container/Component.js';
 import './components/title/Component.js';
 import 'compute-scroll-into-view';
-import './index.module-58709150.js';
+import './index.module-cd918b29.js';
 import '../../tag/modern';
-import './index.module-50ec9b7a.js';
+import './index.module-71e56d00.js';
 import './components/primary-tablist/Component.js';
-import './hooks/use-tablist-titles.js';
-import './synthetic-events.js';
+import './hooks/use-tabs.js';
 import './components/secondary-tablist/Component.js';
 import './components/tabs/Component.js';

package/tabs/modern/hook-9ea9e32c.d.ts

@@ -0,0 +1,75 @@
+/// <reference types="react" />
+import { BaseSelectProps, OptionShape } from "./typings-5e1b8383";
+type UseSelectWithApplyProps = {
+    /**
+     * Список выбранных пунктов
+     */
+    selected: BaseSelectProps['selected'];
+    /**
+     * Список вариантов выбора
+     */
+    options: BaseSelectProps['options'];
+    /**
+     * Обработчик выбора
+     */
+    onChange: BaseSelectProps['onChange'];
+    /**
+     * Компонент выпадающего меню
+     */
+    OptionsList?: BaseSelectProps['OptionsList'];
+    /**
+     * Пропсы, которые будут прокинуты в компонент списка
+     */
+    optionsListProps?: BaseSelectProps['optionsListProps'];
+    /**
+     * Показывать кнопку очистки
+     */
+    showClear?: boolean;
+    /**
+     * Показывать пункт "Выбрать все"
+     */
+    showSelectAll?: boolean;
+    /**
+     * Показывать пункт "Выбрать все" в заголовке списка
+     */
+    showHeaderWithSelectAll?: boolean;
+};
+declare const SELECT_ALL_KEY = "select_all";
+declare function useSelectWithApply({ options, selected, onChange, OptionsList, optionsListProps, showClear, showSelectAll, showHeaderWithSelectAll, }: UseSelectWithApplyProps): {
+    OptionsList: import("react").ForwardRefExoticComponent<import("./typings-5e1b8383").OptionsListProps & {
+        showClear?: boolean | undefined;
+        onClose?: (() => void) | undefined;
+        selectedDraft?: OptionShape[] | undefined;
+        OptionsList?: import("react").FC<import("./typings-5e1b8383").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
+        Footer?: import("react").FC<import("./Component-ebda875c").FooterProps> | undefined;
+        Header?: import("react").FC<import("./Component-ebda875c").HeaderProps> | undefined;
+        headerProps?: import("./Component-ebda875c").HeaderProps | undefined; /**
+         * Показывать кнопку очистки
+         */
+        showHeaderWithSelectAll?: boolean | undefined;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+    optionsListProps: {
+        OptionsList: import("react").FC<import("./typings-5e1b8383").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
+        showClear: boolean;
+        onClear: () => void;
+        onApply: () => void;
+        onClose: () => void;
+        selectedDraft: OptionShape[];
+        showHeaderWithSelectAll: boolean;
+        headerProps: {
+            indeterminate: boolean;
+            checked: boolean;
+            onChange: () => void;
+        };
+    };
+    allowUnselect: boolean;
+    multiple: boolean;
+    options: (OptionShape | import("./typings-5e1b8383").GroupShape | {
+        key: string;
+        content: string;
+    })[];
+    onChange: (payload: import("./typings-5e1b8383").BaseSelectChangePayload) => void;
+    selected: string | OptionShape | (string | OptionShape)[] | null | undefined;
+};
+export * from "./Component-5e1b8383";
+export { UseSelectWithApplyProps, SELECT_ALL_KEY, useSelectWithApply };

package/tabs/modern/hooks/use-tablist-titles.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { TabListProps } from "../typings";
-declare const useTablistTitles: ({ titles, selectedId, collapsible, collapsedTabsIds, breakpoint, onChange, }: Pick<TabListProps, 'titles' | 'selectedId' | 'collapsible' | 'collapsedTabsIds' | 'onChange'> & Required<Pick<TabListProps, 'breakpoint'>>) => {
+declare const useTablistTitles: ({ titles, selectedId, collapsedTabsIds, breakpoint, onChange, defaultMatchMediaValue, }: Pick<TabListProps, 'titles' | 'selectedId' | 'collapsedTabsIds' | 'onChange' | 'defaultMatchMediaValue'> & Required<Pick<TabListProps, 'breakpoint'>>) => {
     containerRef: import("react").RefObject<HTMLDivElement>;
     addonRef: import("react").RefObject<HTMLInputElement>;
     tablistTitles: {
@@ -20,6 +20,7 @@ declare const useTablistTitles: ({ titles, selectedId, collapsible, collapsedTab
         role: string;
         tabIndex: number;
         'aria-selected': boolean;
+        selected: boolean;
         'data-test-id': string | undefined;
         disabled: boolean | undefined;
         ref: (node: HTMLButtonElement) => void;

package/tabs/modern/hooks/use-tablist-titles.js

@@ -1,16 +1,18 @@
 import { useMemo } from 'react';
-import { useMedia } from '@alfalab/hooks';
+import { useMatchMedia } from '../../../mq/modern';
 import { useCollapsibleElements } from './use-collapsible-elements.js';
 import { useTabs } from './use-tabs.js';
 import '@juggle/resize-observer';
+import '@alfalab/hooks';
+import '../../../shared/modern';
 
-const useTablistTitles = ({ titles = [], selectedId, collapsible, collapsedTabsIds, breakpoint, onChange, }) => {
+const useTablistTitles = ({ titles = [], selectedId, collapsedTabsIds, breakpoint, onChange, defaultMatchMediaValue, }) => {
     const { containerRef, addonRef, idsCollapsedElements } = useCollapsibleElements('[role=tab]', [titles, collapsedTabsIds]);
-    const [view] = useMedia([['desktop', `(min-width: ${breakpoint}px)`]], 'desktop');
+    const [isDesktop] = useMatchMedia(`(min-width: ${breakpoint}px)`, defaultMatchMediaValue);
     const tablistTitles = useMemo(() => {
         const idsCollapsedTitles = [];
         const idsCollapsed = idsCollapsedElements.concat(collapsedTabsIds || []);
-        if (view === 'desktop' && collapsible) {
+        if (isDesktop) {
             const visibleTitles = titles.filter(({ id }) => !idsCollapsed.includes(String(id)));
             const lastVisibleTitle = collapsedTabsIds
                 ? null
@@ -45,7 +47,7 @@ const useTablistTitles = ({ titles = [], selectedId, collapsible, collapsedTabsI
             }
             return a.collapsed ? 1 : -1;
         });
-    }, [collapsedTabsIds, idsCollapsedElements, view, collapsible, titles, selectedId]);
+    }, [collapsedTabsIds, idsCollapsedElements, isDesktop, titles, selectedId]);
     const { selectedTab, focusedTab, getTabListItemProps } = useTabs({
         titles: tablistTitles,
         selectedId,

package/tabs/modern/hooks/use-tabs.d.ts

@@ -5,6 +5,7 @@ declare function useTabs({ titles, selectedId, onChange }: UseTabsProps): {
         role: string;
         tabIndex: number;
         'aria-selected': boolean;
+        selected: boolean;
         'data-test-id': string | undefined;
         disabled: boolean | undefined;
         ref: (node: HTMLButtonElement) => void;

package/tabs/modern/hooks/use-tabs.js

@@ -1,9 +1,5 @@
 import { useState, useRef, useCallback } from 'react';
-
-const getDataTestId = (dataTestId, element) => {
-    const elementPart = element ? `-${element.toLowerCase()}` : '';
-    return dataTestId ? `${dataTestId}${elementPart}` : undefined;
-};
+import { getDataTestId } from '../../../shared/modern';
 
 function useTabs({ titles = [], selectedId, onChange }) {
     const [selectedTab, setSelectedTab] = useState(null);
@@ -77,6 +73,7 @@ function useTabs({ titles = [], selectedId, onChange }) {
             role: 'tab',
             tabIndex: itemSelected ? 0 : -1,
             'aria-selected': itemSelected,
+            selected: itemSelected,
             'data-test-id': getDataTestId(item.dataTestId, 'toggle'),
             disabled: item.disabled,
             ref: (node) => {

package/tabs/modern/index-e81c389f.d.ts

@@ -1,3 +1,141 @@
-export * from "./Component-3885b0d7";
-export * from "./index-ebda875c";
-export type { NavigationBarProps } from "./types-ebda875c";
+/// <reference types="react" />
+/* eslint-disable complexity */
+import React from "react";
+import { ReactNode, ButtonHTMLAttributes, ElementType, FC } from "react";
+interface CloserProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Вид компонента
+     */
+    view: "desktop" | "mobile";
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Позиция крестика
+     */
+    align?: "left" | "right";
+    /**
+     * Фиксирует крестик
+     */
+    sticky?: boolean;
+    /**
+     * Иконка
+     */
+    icon?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Коллбэк закрытия.
+     */
+    onClose?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, reason?: "backdropClick" | "escapeKeyDown" | "closerClick") => void;
+}
+declare const Closer: FC<CloserProps>;
+type NavigationBarProps = {
+    /**
+     * Контент шапки
+     */
+    children?: ReactNode;
+    /**
+     * Заголовок шапки
+     */
+    title?: string;
+    /**
+     * Подзаголовок (доступен только в мобильной версии)
+     */
+    subtitle?: string;
+    /**
+     * Размер заголовка (compact доступен только в мобильной версии)
+     */
+    titleSize?: "default" | "compact";
+    /**
+     * Доп. класс для аддонов
+     */
+    addonClassName?: string;
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Дополнительный класс для closer
+     */
+    closerClassName?: string;
+    /**
+     * Слот снизу
+     */
+    bottomAddons?: ReactNode;
+    /**
+     * Наличие компонента крестика
+     */
+    hasCloser?: boolean;
+    /**
+     * Наличие кнопки "Назад"
+     */
+    hasBackButton?: boolean;
+    /**
+     * Дополнительный класс для правого аддона
+     */
+    backButtonClassName?: string;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для контента
+     */
+    contentClassName?: string;
+    /**
+     * Дополнительный класс для нижнего аддона
+     */
+    bottomAddonsClassName?: string;
+    /**
+     * Выравнивание заголовка
+     */
+    align?: "left" | "center";
+    /**
+     * Обрезать ли заголовок
+     */
+    trim?: boolean;
+    /**
+     * Фиксирует шапку
+     */
+    sticky?: boolean;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Фоновое изображение
+     */
+    imageUrl?: string;
+    /**
+     * Иконка closer.
+     */
+    closerIcon?: React.ElementType;
+    /**
+     * Обработчик закрытия
+     */
+    onClose?: CloserProps["onClose"];
+    /**
+     * обработчик клика по кнопке "назад"
+     */
+    onBack?: () => void;
+    /**
+     * Вид шапки - мобильный или десктоп
+     */
+    view: "desktop" | "mobile";
+    /**
+     * Ссылка на родительскую ноду overflow: auto
+     */
+    scrollableParentRef?: React.RefObject<HTMLDivElement>;
+};
+declare const NavigationBar: React.ForwardRefExoticComponent<NavigationBarProps & React.RefAttributes<HTMLDivElement>>;
+export { NavigationBar, CloserProps, Closer };
+export * from "./Component-ebda875c";
+export type { NavigationBarProps };

package/tabs/modern/index-ebda875c.d.ts

@@ -1,37 +1,40 @@
-/// <reference types="react" />
 /// <reference types="react-transition-group" />
+/// <reference types="react" />
 import React from "react";
-import { ButtonHTMLAttributes, ElementType, FC } from "react";
-interface CloserProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+import { MouseEvent, ReactNode } from "react";
+import { CSSTransitionClassNames } from "react-transition-group/CSSTransition";
+import { TransitionProps } from "react-transition-group/Transition";
+type BackdropProps = Partial<TransitionProps> & {
     /**
-     * Вид компонента
+     * Прозрачный бэкдроп
      */
-    view: "desktop" | "mobile";
+    invisible?: boolean;
     /**
-     * Дополнительный класс
+     * Управляет видимостью компонента
      */
-    className?: string;
+    open: boolean;
     /**
-     * Позиция крестика
+     * Обработчик клика по бэкдропу
      */
-    align?: "left" | "right";
+    onClose?: (event: MouseEvent<HTMLElement>) => void;
     /**
-     * Фиксирует крестик
+     * Дополнительный класс
      */
-    sticky?: boolean;
+    className?: string;
     /**
-     * Иконка
+     * Классы анимации
+     *
+     * http://reactcommunity.org/react-transition-group/css-transition#CSSTransition-prop-classNames
      */
-    icon?: ElementType;
+    transitionClassNames?: string | CSSTransitionClassNames;
     /**
      * Идентификатор для систем автоматизированного тестирования
      */
     dataTestId?: string;
     /**
-     * Коллбэк закрытия.
+     * Дочерние элементы.
      */
-    onClose?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, reason?: "backdropClick" | "escapeKeyDown" | "closerClick") => void;
-}
-declare const Closer: FC<CloserProps>;
-export { CloserProps, Closer };
-export * from "./Component-ebda875c";
+    children?: ReactNode;
+};
+declare const Backdrop: React.FC<BackdropProps>;
+export { BackdropProps, Backdrop };