@alfalab/core-components-picker-button 11.1.2 → 11.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (54) hide show
  1. package/Component-1a4fbd11.d.ts +274 -4
  2. package/Component-72dda473.d.ts +53 -0
  3. package/Component-aed0af6e.d.ts +11 -0
  4. package/Component-dd8ca091.d.ts +3 -70
  5. package/Component-ebda875c.d.ts +98 -9
  6. package/Component-f12ee135.d.ts +72 -0
  7. package/Component.desktop.d.ts +1 -1
  8. package/Component.desktop.js +1 -1
  9. package/Component.mobile-96988a65.d.ts +6 -0
  10. package/Component.mobile.d.ts +1 -1
  11. package/Component.responsive.d.ts +1 -1
  12. package/cssm/component-1a4fbd11.d.ts +1 -1
  13. package/cssm/index-f12ee135.d.ts +1 -1
  14. package/{types-b0ff398d.d.ts → cssm/types-e40becc7.d.ts} +6 -2
  15. package/esm/Component.desktop.js +1 -1
  16. package/esm/component-1a4fbd11.d.ts +1 -1
  17. package/esm/field/Component.js +1 -1
  18. package/esm/field/index.css +6 -6
  19. package/esm/index-f12ee135.d.ts +1 -1
  20. package/esm/index.css +5 -5
  21. package/esm/option/Component.js +1 -1
  22. package/esm/option/index.css +4 -4
  23. package/{cssm/types-b0ff398d.d.ts → esm/types-e40becc7.d.ts} +6 -2
  24. package/field/Component.js +1 -1
  25. package/field/index.css +6 -6
  26. package/hook-8abfea97.d.ts +4 -4
  27. package/hook-ebda875c.d.ts +48 -0
  28. package/index-1a4fbd11.d.ts +2 -2
  29. package/index-bdb4c6b9.d.ts +180 -2
  30. package/index-c44170fe.d.ts +3 -145
  31. package/index-ebda875c.d.ts +191 -53
  32. package/index-f12ee135.d.ts +324 -3
  33. package/index.css +5 -5
  34. package/modern/Component.desktop.js +1 -1
  35. package/modern/component-1a4fbd11.d.ts +1 -1
  36. package/modern/field/Component.js +1 -1
  37. package/modern/field/index.css +6 -6
  38. package/modern/index-f12ee135.d.ts +1 -1
  39. package/modern/index.css +5 -5
  40. package/modern/option/Component.js +1 -1
  41. package/modern/option/index.css +4 -4
  42. package/{esm/types-b0ff398d.d.ts → modern/types-e40becc7.d.ts} +6 -2
  43. package/option/Component.js +1 -1
  44. package/option/index.css +4 -4
  45. package/package.json +2 -2
  46. package/shared-4cd3936b.d.ts +1 -59
  47. package/Component-63dec22f.d.ts +0 -184
  48. package/Component.modal.mobile-dd8ca091.d.ts +0 -60
  49. package/component-1a4fbd11.d.ts +0 -44
  50. package/modern/types-b0ff398d.d.ts +0 -272
  51. package/utils-1574ad8b.d.ts +0 -29
  52. package/utils-49cc3c24.d.ts +0 -8
  53. /package/{Component.responsive-3109f463.d.ts → Component.responsive-d7e9f69d.d.ts} +0 -0
  54. /package/{useSkeleton-ebda875c.d.ts → useSkeleton-1b036d4b.d.ts} +0 -0
@@ -265,8 +265,12 @@ type BottomSheetProps = {
265
265
  */
266
266
  onOffsetChange?: (offset: number, percent: number) => void;
267
267
  /**
268
- * Вызывается для событий touchend and mouseup.
268
+ * Вызывается в начале свайпа
269
269
  */
270
- onTouchEnd?: (event: HandledEvents) => void;
270
+ onSwipeStart?: (event: HandledEvents) => void;
271
+ /**
272
+ * Вызывается после окончания свайпа
273
+ */
274
+ onSwipeEnd?: (event: HandledEvents | null) => void;
271
275
  };
272
276
  export { BottomSheetTitleAlign, BottomSheetProps };
@@ -11,7 +11,7 @@ import '@alfalab/icons-glyph/ChevronDownMIcon';
11
11
  import '@alfalab/icons-glyph/MoreMIcon';
12
12
  import '@alfalab/icons-glyph/MoreSIcon';
13
13
 
14
- var styles = {"container":"picker-button__container_qnztj","optionsPopover":"picker-button__optionsPopover_qnztj","sideGap":"picker-button__sideGap_qnztj","option":"picker-button__option_qnztj"};
14
+ var styles = {"container":"picker-button__container_1168s","optionsPopover":"picker-button__optionsPopover_1168s","sideGap":"picker-button__sideGap_1168s","option":"picker-button__option_1168s"};
15
15
  require('./index.css')
16
16
 
17
17
  var SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
@@ -4,7 +4,7 @@ import { FC, ReactNode, RefObject } from "react";
4
4
  import { NavigationBarProps } from "./index-c76d6398";
5
5
  import { SwipeableHandlers } from "react-swipeable";
6
6
  import { BackdropProps } from "./index-ebda875c";
7
- import { BottomSheetProps } from "./types-b0ff398d";
7
+ import { BottomSheetProps } from "./types-e40becc7";
8
8
  type FooterProps = {
9
9
  /**
10
10
  * Контент футера
@@ -8,7 +8,7 @@ import '@alfalab/icons-glyph/ChevronDownMIcon';
8
8
  import '@alfalab/icons-glyph/MoreMIcon';
9
9
  import '@alfalab/icons-glyph/MoreSIcon';
10
10
 
11
- var styles = {"iconContainer":"picker-button__iconContainer_wvylg","addonsContainer":"picker-button__addonsContainer_wvylg","showControlIcon":"picker-button__showControlIcon_wvylg","open":"picker-button__open_wvylg","linkOpen":"picker-button__linkOpen_wvylg"};
11
+ var styles = {"iconContainer":"picker-button__iconContainer_fnw1k","addonsContainer":"picker-button__addonsContainer_fnw1k","showControlIcon":"picker-button__showControlIcon_fnw1k","open":"picker-button__open_fnw1k","linkOpen":"picker-button__linkOpen_fnw1k"};
12
12
  require('./index.css')
13
13
 
14
14
  var Field = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 9bzdu */
1
+ /* hash: p59uq */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-specialbg-secondary-transparent: rgba(11, 31, 53, 0.05); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -17,15 +17,15 @@
17
17
  } :root {
18
18
  } :root {
19
19
  --arrow-transform: rotate(180deg);
20
- } .picker-button__iconContainer_wvylg {
20
+ } .picker-button__iconContainer_fnw1k {
21
21
  display: flex;
22
22
  transition: transform 0.15s ease-in-out;
23
- } .picker-button__addonsContainer_wvylg {
23
+ } .picker-button__addonsContainer_fnw1k {
24
24
  display: flex
25
- } .picker-button__addonsContainer_wvylg.picker-button__showControlIcon_wvylg {
25
+ } .picker-button__addonsContainer_fnw1k.picker-button__showControlIcon_fnw1k {
26
26
  margin-right: var(--gap-2xs);
27
- } .picker-button__open_wvylg {
27
+ } .picker-button__open_fnw1k {
28
28
  transform: var(--arrow-transform);
29
- } .picker-button__linkOpen_wvylg:not(:hover) {
29
+ } .picker-button__linkOpen_fnw1k:not(:hover) {
30
30
  background-color: var(--color-light-specialbg-secondary-transparent);
31
31
  }
@@ -1,3 +1,3 @@
1
1
  export * from "./component-1a4fbd11";
2
- export type { BottomSheetProps, BottomSheetTitleAlign } from "./types-b0ff398d";
2
+ export type { BottomSheetProps, BottomSheetTitleAlign } from "./types-e40becc7";
3
3
  export { CLOSE_OFFSET, HEADER_OFFSET } from "./utils-49cc3c24";
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1xiea */
1
+ /* hash: i56f1 */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
16
16
  --gap-m: 16px;
17
17
  } :root {
18
18
  } :root {
19
- } .picker-button__container_qnztj {
19
+ } .picker-button__container_1168s {
20
20
  min-width: auto;
21
- } .cc-picker-button.picker-button__optionsPopover_qnztj.picker-button__sideGap_qnztj {
21
+ } .cc-picker-button.picker-button__optionsPopover_1168s.picker-button__sideGap_1168s {
22
22
  padding: 0 var(--gap-xs);
23
- } .cc-picker-button .picker-button__option_qnztj {
23
+ } .cc-picker-button .picker-button__option_1168s {
24
24
  padding: 0 var(--gap-m)
25
- } .cc-picker-button .picker-button__option_qnztj:before {
25
+ } .cc-picker-button .picker-button__option_1168s:before {
26
26
  /* Удаляем разделители у опций выпадающего списка. */
27
27
  display: none;
28
28
  }
@@ -2,7 +2,7 @@ import { __rest, __assign } from 'tslib';
2
2
  import React from 'react';
3
3
  import { Option as Option$1 } from '@alfalab/core-components-select/esm/shared';
4
4
 
5
- var styles = {"container":"picker-button__container_18cv3","icon":"picker-button__icon_18cv3","content":"picker-button__content_18cv3"};
5
+ var styles = {"container":"picker-button__container_1iv42","icon":"picker-button__icon_1iv42","content":"picker-button__content_1iv42"};
6
6
  require('./index.css')
7
7
 
8
8
  var Option = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1bo5l */
1
+ /* hash: 1vc1s */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -15,13 +15,13 @@
15
15
  --gap-s: 12px;
16
16
  } :root {
17
17
  } :root {
18
- } .picker-button__container_18cv3 {
18
+ } .picker-button__container_1iv42 {
19
19
  display: flex;
20
20
  align-items: center;
21
- } .picker-button__icon_18cv3 {
21
+ } .picker-button__icon_1iv42 {
22
22
  display: flex;
23
23
  margin-right: var(--gap-s);
24
- } .picker-button__content_18cv3 {
24
+ } .picker-button__content_1iv42 {
25
25
  overflow: hidden;
26
26
  flex: 1;
27
27
  text-overflow: ellipsis;
@@ -265,8 +265,12 @@ type BottomSheetProps = {
265
265
  */
266
266
  onOffsetChange?: (offset: number, percent: number) => void;
267
267
  /**
268
- * Вызывается для событий touchend and mouseup.
268
+ * Вызывается в начале свайпа
269
269
  */
270
- onTouchEnd?: (event: HandledEvents) => void;
270
+ onSwipeStart?: (event: HandledEvents) => void;
271
+ /**
272
+ * Вызывается после окончания свайпа
273
+ */
274
+ onSwipeEnd?: (event: HandledEvents | null) => void;
271
275
  };
272
276
  export { BottomSheetTitleAlign, BottomSheetProps };
@@ -17,7 +17,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
17
17
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
18
18
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
19
19
 
20
- var styles = {"iconContainer":"picker-button__iconContainer_wvylg","addonsContainer":"picker-button__addonsContainer_wvylg","showControlIcon":"picker-button__showControlIcon_wvylg","open":"picker-button__open_wvylg","linkOpen":"picker-button__linkOpen_wvylg"};
20
+ var styles = {"iconContainer":"picker-button__iconContainer_fnw1k","addonsContainer":"picker-button__addonsContainer_fnw1k","showControlIcon":"picker-button__showControlIcon_fnw1k","open":"picker-button__open_fnw1k","linkOpen":"picker-button__linkOpen_fnw1k"};
21
21
  require('./index.css')
22
22
 
23
23
  var Field = function (_a) {
package/field/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 9bzdu */
1
+ /* hash: p59uq */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-specialbg-secondary-transparent: rgba(11, 31, 53, 0.05); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -17,15 +17,15 @@
17
17
  } :root {
18
18
  } :root {
19
19
  --arrow-transform: rotate(180deg);
20
- } .picker-button__iconContainer_wvylg {
20
+ } .picker-button__iconContainer_fnw1k {
21
21
  display: flex;
22
22
  transition: transform 0.15s ease-in-out;
23
- } .picker-button__addonsContainer_wvylg {
23
+ } .picker-button__addonsContainer_fnw1k {
24
24
  display: flex
25
- } .picker-button__addonsContainer_wvylg.picker-button__showControlIcon_wvylg {
25
+ } .picker-button__addonsContainer_fnw1k.picker-button__showControlIcon_fnw1k {
26
26
  margin-right: var(--gap-2xs);
27
- } .picker-button__open_wvylg {
27
+ } .picker-button__open_fnw1k {
28
28
  transform: var(--arrow-transform);
29
- } .picker-button__linkOpen_wvylg:not(:hover) {
29
+ } .picker-button__linkOpen_fnw1k:not(:hover) {
30
30
  background-color: var(--color-light-specialbg-secondary-transparent);
31
31
  }
@@ -51,9 +51,9 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
51
51
  */
52
52
  selectedDraft?: OptionShape[] | undefined;
53
53
  OptionsList?: import("react").FC<import("./typings-dd8ca091").OptionsListProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
54
- Footer?: import("react").FC<import("./Component-dd8ca091").FooterProps> | undefined;
55
- Header?: import("react").FC<import("./Component-ebda875c").HeaderProps> | undefined;
56
- headerProps?: import("./Component-ebda875c").HeaderProps | undefined;
54
+ Footer?: import("react").FC<import("./Component-ebda875c").FooterProps> | undefined;
55
+ Header?: import("react").FC<import("./Component-aed0af6e").HeaderProps> | undefined;
56
+ headerProps?: import("./Component-aed0af6e").HeaderProps | undefined;
57
57
  showHeaderWithSelectAll?: boolean | undefined;
58
58
  } & import("react").RefAttributes<HTMLDivElement>>;
59
59
  optionsListProps: {
@@ -86,5 +86,5 @@ declare function useSelectWithApply({ options, selected, onChange, OptionsList,
86
86
  accessor?: ((option: OptionShape) => string) | undefined;
87
87
  } | undefined;
88
88
  };
89
- export * from "./Component-dd8ca091";
89
+ export * from "./Component-ebda875c";
90
90
  export { UseSelectWithApplyProps, SELECT_ALL_KEY, useSelectWithApply };
@@ -0,0 +1,48 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { OptionProps, OptionShape } from "./typings-dd8ca091";
4
+ type OptionsFetcherResponse = {
5
+ options: OptionShape[];
6
+ hasMore: boolean;
7
+ };
8
+ type useLazyLoadingProps = {
9
+ /** Количество элементов на "странице" */
10
+ limit?: number;
11
+ /** Начальный номер "страницы" */
12
+ initialOffset?: number;
13
+ /** Скелетон загружаемых элементов */
14
+ skeleton?: React.ReactNode;
15
+ /** Компонент пункта меню */
16
+ Option?: React.FC<OptionProps>;
17
+ /**
18
+ * Функция-загрузчик опций.
19
+ * @param offset - текущая страница
20
+ * @param limit - количество элементов на странице
21
+ * @param queryString - строчные данные, пробрасываемые для поиска из кастомного инпута, расположенного в заголовке OptionsList
22
+ * @returns Promise<{
23
+ * options - список опций следующей "страницы". Они аппендятся к предыдущим
24
+ * hasMore - указывает, есть ли еще незагруженные элементы (в случае false перестает загружать "следующую страницу")
25
+ * }>
26
+ */
27
+ optionsFetcher(offset: number, limit: number, queryString?: string): Promise<OptionsFetcherResponse>;
28
+ };
29
+ declare function useLazyLoading({ limit, initialOffset, optionsFetcher, skeleton, Option, }: useLazyLoadingProps): {
30
+ optionsProps: {
31
+ Option: (props: OptionProps) => React.JSX.Element;
32
+ options: OptionShape[];
33
+ optionsListProps: {
34
+ ref: React.RefObject<HTMLDivElement>;
35
+ inputProps: {
36
+ onChange: (event: React.ChangeEvent<HTMLInputElement>, payload: {
37
+ value: string;
38
+ }) => void;
39
+ value: string;
40
+ };
41
+ };
42
+ onOpen: (payload: {
43
+ open?: boolean;
44
+ }) => void;
45
+ };
46
+ reset: () => void;
47
+ };
48
+ export { useLazyLoading };
@@ -1,9 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
3
  import { PaddingType } from "./index-72dda473";
4
- declare function createPaddingStyle(padding?: PaddingType): undefined | React.CSSProperties;
5
4
  declare const isClient: () => boolean;
6
5
  declare const getDataTestId: (dataTestId?: string, element?: string) => string | undefined;
6
+ declare function createPaddingStyle(padding?: PaddingType): undefined | React.CSSProperties;
7
7
  declare function easeInOutQuad(x: number): number;
8
8
  declare const easingFns: {
9
9
  easeInOutQuad: typeof easeInOutQuad;
@@ -19,4 +19,4 @@ declare function isNil(value: unknown): boolean;
19
19
  declare const fnUtils: {
20
20
  isNil: typeof isNil;
21
21
  };
22
- export { createPaddingStyle, isClient, getDataTestId, easingFns, inputUtils, fnUtils };
22
+ export { isClient, getDataTestId, createPaddingStyle, easingFns, inputUtils, fnUtils };
@@ -1,2 +1,180 @@
1
- export * from "./Component-ebda875c";
2
- export * from "./utils-1574ad8b";
1
+ /// <reference types="react" />
2
+ /// <reference types="react-transition-group" />
3
+ /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
4
+ import React from "react";
5
+ import { FC, KeyboardEvent, MouseEvent, MutableRefObject, ReactNode, Ref } from "react";
6
+ import { TransitionProps } from "react-transition-group/Transition";
7
+ import { BackdropProps, PortalProps } from "./index-ebda875c";
8
+ type BaseModalProps = {
9
+ /**
10
+ * Контент
11
+ */
12
+ children?: ReactNode;
13
+ /**
14
+ * Компонент бэкдропа
15
+ */
16
+ Backdrop?: FC<BackdropProps>;
17
+ /**
18
+ * Свойства для Бэкдропа
19
+ */
20
+ backdropProps?: Partial<BackdropProps> & Record<string, unknown>;
21
+ /**
22
+ * Нода, компонент или функция возвращающая их
23
+ *
24
+ * Контейнер к которому будут добавляться порталы
25
+ */
26
+ container?: PortalProps["getPortalContainer"];
27
+ /**
28
+ * Отключает автоматический перевод фокуса на модалку при открытии
29
+ * @default false
30
+ */
31
+ disableAutoFocus?: boolean;
32
+ /**
33
+ * Отключает ловушку фокуса
34
+ * @default false
35
+ */
36
+ disableFocusLock?: boolean;
37
+ /**
38
+ * Отключает восстановление фокуса на предыдущем элементе после закрытия модалки
39
+ * @default false
40
+ */
41
+ disableRestoreFocus?: boolean;
42
+ /**
43
+ * Отключает вызов `callback` при нажатии Escape
44
+ * @default false
45
+ */
46
+ disableEscapeKeyDown?: boolean;
47
+ /**
48
+ * Отключает вызов `callback` при клике на бэкдроп
49
+ * @default false
50
+ */
51
+ disableBackdropClick?: boolean;
52
+ /**
53
+ * Отключает блокировку скролла при открытии модального окна
54
+ * @default false
55
+ */
56
+ disableBlockingScroll?: boolean;
57
+ /**
58
+ * Содержимое модалки всегда в DOM
59
+ * @default false
60
+ */
61
+ keepMounted?: boolean;
62
+ /**
63
+ * Управление видимостью модалки
64
+ */
65
+ open: boolean;
66
+ /**
67
+ * Дополнительный класс
68
+ */
69
+ className?: string;
70
+ /**
71
+ * Дополнительный класс
72
+ */
73
+ contentClassName?: string;
74
+ /**
75
+ * Дополнительные пропсы на обертку контента
76
+ */
77
+ contentProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
78
+ /**
79
+ * Дополнительные пропсы на компонентную обертку контента
80
+ */
81
+ componentDivProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
82
+ /**
83
+ * Дополнительный класс для обертки (Modal)
84
+ */
85
+ wrapperClassName?: string;
86
+ /**
87
+ * Обработчик скролла контента
88
+ */
89
+ scrollHandler?: "wrapper" | "content" | MutableRefObject<HTMLDivElement | null>;
90
+ /**
91
+ * Пропсы для анимации (CSSTransition)
92
+ */
93
+ transitionProps?: Partial<TransitionProps>;
94
+ /**
95
+ * Рендерить ли в контейнер через портал.
96
+ * @default true
97
+ */
98
+ usePortal?: boolean;
99
+ /**
100
+ * Обработчик события нажатия на бэкдроп
101
+ */
102
+ onBackdropClick?: (event: MouseEvent) => void;
103
+ /**
104
+ * Обработчик события нажатия на Escape
105
+ *
106
+ * Если `disableEscapeKeyDown` - false и модальное окно в фокусе
107
+ */
108
+ onEscapeKeyDown?: (event: KeyboardEvent) => void;
109
+ /**
110
+ * Обработчик закрытия
111
+ */
112
+ onClose?: (event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>, reason?: "backdropClick" | "escapeKeyDown" | "closerClick") => void;
113
+ /**
114
+ * Обработчик события onEntered компонента Transition
115
+ */
116
+ onMount?: () => void;
117
+ /**
118
+ * Обработчик события onExited компонента Transition
119
+ */
120
+ onUnmount?: () => void;
121
+ /**
122
+ * Идентификатор для систем автоматизированного тестирования
123
+ */
124
+ dataTestId?: string;
125
+ /**
126
+ * z-index компонента
127
+ */
128
+ zIndex?: number;
129
+ /**
130
+ * Реф, который должен быть установлен компонентной области
131
+ */
132
+ componentRef?: MutableRefObject<HTMLDivElement | null>;
133
+ };
134
+ type BaseModalContext = {
135
+ parentRef: React.RefObject<HTMLDivElement>;
136
+ componentRef: React.RefObject<HTMLDivElement>;
137
+ hasFooter?: boolean;
138
+ hasHeader?: boolean;
139
+ hasScroll?: boolean;
140
+ headerHighlighted?: boolean;
141
+ footerHighlighted?: boolean;
142
+ headerOffset?: number;
143
+ setHeaderOffset: (offset: number) => void;
144
+ contentRef: Ref<HTMLElement>;
145
+ setHasHeader: (exists: boolean) => void;
146
+ setHasFooter: (exists: boolean) => void;
147
+ onClose: Required<BaseModalProps>["onClose"];
148
+ };
149
+ // eslint-disable-next-line @typescript-eslint/no-redeclare
150
+ declare const BaseModalContext: React.Context<BaseModalContext>;
151
+ declare const BaseModal: React.ForwardRefExoticComponent<BaseModalProps & React.RefAttributes<HTMLDivElement>>;
152
+ declare function isScrolledToTop(target: HTMLElement): boolean;
153
+ declare function isScrolledToBottom(target: HTMLElement): boolean;
154
+ declare function hasScrollbar(target: HTMLElement): boolean;
155
+ declare const getScrollbarSize: () => number;
156
+ declare const restoreContainerStyles: (container: HTMLElement) => void;
157
+ declare const handleContainer: (container?: HTMLElement) => void;
158
+ type SavedStyle = {
159
+ value: string;
160
+ key: string;
161
+ el: HTMLElement;
162
+ };
163
+ type RestoreStyle = {
164
+ container: HTMLElement;
165
+ modals: number;
166
+ styles: SavedStyle[];
167
+ };
168
+ declare class ModalStore {
169
+ private readonly restoreStyles;
170
+ constructor();
171
+ getRestoreStyles: () => RestoreStyle[];
172
+ }
173
+ declare const getModalStore: () => ModalStore;
174
+ declare class GlobalStore {
175
+ private readonly modalStore;
176
+ constructor();
177
+ getModalStore: () => ModalStore;
178
+ }
179
+ export { BaseModalProps, BaseModalContext, BaseModal, isScrolledToTop, isScrolledToBottom, hasScrollbar, getScrollbarSize, restoreContainerStyles, handleContainer, getModalStore, GlobalStore };
180
+ export type { SavedStyle };
@@ -1,146 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
- import { ChangeEvent, ElementType, InputHTMLAttributes, MouseEvent, ReactNode } from "react";
4
- type StyleColors = {
5
- default: {
6
- [key: string]: string;
7
- };
8
- inverted: {
9
- [key: string]: string;
10
- };
11
- };
12
- type BaseInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "value" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "enterKeyHint"> & {
13
- /**
14
- * Значение поля ввода
15
- */
16
- value?: string;
17
- /**
18
- * Начальное значение поля
19
- */
20
- defaultValue?: string;
21
- /**
22
- * Растягивает компонент на ширину контейнера
23
- */
24
- block?: boolean;
25
- /**
26
- * Крестик для очистки поля
27
- */
28
- clear?: boolean;
29
- /**
30
- * Размер компонента
31
- */
32
- size?: "s" | "m" | "l" | "xl";
33
- /**
34
- * Набор цветов для компонента
35
- */
36
- colors?: "default" | "inverted";
37
- /**
38
- * Отображение ошибки
39
- */
40
- error?: ReactNode | boolean;
41
- /**
42
- * Отображение иконки успеха
43
- */
44
- success?: boolean;
45
- /**
46
- * Текст подсказки
47
- */
48
- hint?: ReactNode;
49
- /**
50
- * Лейбл компонента
51
- */
52
- label?: React.ReactNode;
53
- /**
54
- * Вид лейбла внутри / снаружи
55
- */
56
- labelView?: "inner" | "outer";
57
- /**
58
- * Атрибут type
59
- */
60
- type?: "number" | "card" | "email" | "money" | "password" | "tel" | "text";
61
- /**
62
- * Ref для обертки input
63
- */
64
- wrapperRef?: React.Ref<HTMLDivElement> | null;
65
- /**
66
- * Слот слева
67
- */
68
- leftAddons?: React.ReactNode;
69
- /**
70
- * Слот справа
71
- */
72
- rightAddons?: React.ReactNode;
73
- /**
74
- * Слот под инпутом
75
- */
76
- bottomAddons?: React.ReactNode;
77
- /**
78
- * Дополнительный класс
79
- */
80
- className?: string;
81
- /**
82
- * Дополнительный класс для поля
83
- */
84
- fieldClassName?: string;
85
- /**
86
- * Дополнительный класс инпута
87
- */
88
- inputClassName?: string;
89
- /**
90
- * Дополнительный класс для лейбла
91
- */
92
- labelClassName?: string;
93
- /**
94
- * Дополнительный класс для аддонов
95
- */
96
- addonsClassName?: string;
97
- /**
98
- * Класс, который будет установлен при фокусе
99
- */
100
- focusedClassName?: string;
101
- /**
102
- * Класс, который будет установлен, если в поле есть значение
103
- */
104
- filledClassName?: string;
105
- /**
106
- * Обработчик поля ввода
107
- */
108
- onChange?: (event: ChangeEvent<HTMLInputElement>, payload: {
109
- value: string;
110
- }) => void;
111
- /**
112
- * Обработчик нажатия на кнопку очистки
113
- */
114
- onClear?: (event: MouseEvent<HTMLButtonElement>) => void;
115
- /**
116
- * Обработчик клика по полю
117
- */
118
- onClick?: (event: MouseEvent<HTMLDivElement>) => void;
119
- /**
120
- * Обработчик MouseDown по полю
121
- */
122
- onMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;
123
- /**
124
- * Обработчик MouseUp по полю
125
- */
126
- onMouseUp?: (event: MouseEvent<HTMLDivElement>) => void;
127
- /**
128
- * Идентификатор для систем автоматизированного тестирования
129
- */
130
- FormControlComponent?: ElementType;
131
- /**
132
- * Идентификатор для систем автоматизированного тестирования
133
- */
134
- dataTestId?: string;
135
- /**
136
- * Стили компонента для default и inverted режима.
137
- */
138
- colorStyles?: StyleColors;
139
- /**
140
- * Запрещает ввод с клавиатуры
141
- */
142
- disableUserInput?: boolean;
143
- };
3
+ import { BaseInputProps } from "./index-ebda875c";
144
4
  type InputProps = Omit<BaseInputProps, "FormControlComponent" | "colorStyles"> & {
145
5
  /**
146
6
  * Контрольная точка, с нее начинается desktop версия
@@ -152,13 +12,11 @@ type InputProps = Omit<BaseInputProps, "FormControlComponent" | "colorStyles"> &
152
12
  */
153
13
  defaultMatchMediaValue?: boolean | (() => boolean);
154
14
  };
155
- declare const Input: React.ForwardRefExoticComponent<Omit<BaseInputProps, "FormControlComponent" | "colorStyles"> & {
15
+ declare const Input: React.ForwardRefExoticComponent<Omit<BaseInputProps, "colorStyles" | "FormControlComponent"> & {
156
16
  breakpoint?: number | undefined;
157
17
  defaultMatchMediaValue?: boolean | (() => boolean) | undefined;
158
18
  } & React.RefAttributes<HTMLInputElement>>;
159
19
  type InputDesktopProps = Omit<BaseInputProps, "FormControlComponent" | "colorStyles">;
160
20
  declare const InputDesktop: React.ForwardRefExoticComponent<InputDesktopProps & React.RefAttributes<HTMLInputElement>>;
161
- type InputMobileProps = Omit<BaseInputProps, "FormControlComponent" | "colorStyles">;
162
- declare const InputMobile: React.ForwardRefExoticComponent<InputMobileProps & React.RefAttributes<HTMLInputElement>>;
163
- export { InputProps, Input, InputDesktopProps, InputDesktop, InputMobileProps, InputMobile };
21
+ export { InputProps, Input, InputDesktopProps, InputDesktop };
164
22
  export * from "./Component.desktop-785df74d";