@alfalab/core-components-calendar-with-skeleton 5.0.50 → 5.1.0

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 (47) hide show
  1. package/Component-63dec22f.d.ts +24 -0
  2. package/Component.d.ts +112 -3
  3. package/Component.desktop-2e2b2125.d.ts +6 -0
  4. package/Component.js +3 -3
  5. package/Component.responsive-2e2b2125.d.ts +68 -0
  6. package/cssm/Component-63dec22f.d.ts +24 -0
  7. package/cssm/Component.d.ts +112 -3
  8. package/cssm/Component.desktop-2e2b2125.d.ts +6 -0
  9. package/cssm/Component.js +2 -2
  10. package/cssm/Component.responsive-2e2b2125.d.ts +68 -0
  11. package/cssm/desktop-63dec22f.d.ts +2 -0
  12. package/cssm/index-9211a437.d.ts +2 -0
  13. package/cssm/index-ebda875c.d.ts +42 -0
  14. package/cssm/index.js +1 -1
  15. package/cssm/typings-9211a437.d.ts +95 -0
  16. package/desktop-63dec22f.d.ts +2 -0
  17. package/esm/Component-63dec22f.d.ts +24 -0
  18. package/esm/Component.d.ts +112 -3
  19. package/esm/Component.desktop-2e2b2125.d.ts +6 -0
  20. package/esm/Component.js +3 -3
  21. package/esm/Component.responsive-2e2b2125.d.ts +68 -0
  22. package/esm/desktop-63dec22f.d.ts +2 -0
  23. package/esm/index-9211a437.d.ts +2 -0
  24. package/esm/index-ebda875c.d.ts +42 -0
  25. package/esm/index.css +12 -12
  26. package/esm/index.js +1 -1
  27. package/esm/typings-9211a437.d.ts +95 -0
  28. package/index-9211a437.d.ts +2 -0
  29. package/index-ebda875c.d.ts +42 -0
  30. package/index.css +12 -12
  31. package/index.js +1 -1
  32. package/modern/Component-63dec22f.d.ts +24 -0
  33. package/modern/Component.d.ts +112 -3
  34. package/modern/Component.desktop-2e2b2125.d.ts +6 -0
  35. package/modern/Component.js +3 -3
  36. package/modern/Component.responsive-2e2b2125.d.ts +68 -0
  37. package/modern/desktop-63dec22f.d.ts +2 -0
  38. package/modern/index-9211a437.d.ts +2 -0
  39. package/modern/index-ebda875c.d.ts +42 -0
  40. package/modern/index.css +12 -12
  41. package/modern/index.js +1 -1
  42. package/modern/typings-9211a437.d.ts +95 -0
  43. package/package.json +3 -3
  44. package/src/Component.tsx +55 -0
  45. package/src/index.module.css +56 -0
  46. package/src/index.ts +1 -0
  47. package/typings-9211a437.d.ts +95 -0
@@ -0,0 +1,24 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { ButtonHTMLAttributes } from "react";
4
+ type SelectButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
5
+ /**
6
+ * Дополнительный класс
7
+ */
8
+ className?: string;
9
+ /**
10
+ * Вид кнопки
11
+ */
12
+ view?: 'default' | 'filled' | 'outlined' | 'selected';
13
+ };
14
+ declare const SelectButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
15
+ /**
16
+ * Дополнительный класс
17
+ */
18
+ className?: string | undefined;
19
+ /**
20
+ * Вид кнопки
21
+ */
22
+ view?: "default" | "outlined" | "filled" | "selected" | undefined;
23
+ } & React.RefAttributes<HTMLButtonElement>>;
24
+ export { SelectButtonProps, SelectButton };
package/Component.d.ts CHANGED
@@ -1,7 +1,116 @@
1
1
  /// <reference types="react" />
2
2
  import React from 'react';
3
- import { CalendarProps } from "@alfalab/core-components-calendar";
4
- type CalendarWithSkeletonProps = CalendarProps & {
3
+ import { MouseEvent, ReactNode } from "react";
4
+ type DayAddons = {
5
+ date: Date | number;
6
+ addon: ReactNode;
7
+ };
8
+ type View = "years" | "months" | "days";
9
+ type SelectorView = "month-only" | "full";
10
+ type CalendarDesktopProps = {
11
+ /**
12
+ * Дополнительный класс
13
+ */
14
+ className?: string;
15
+ /**
16
+ * Вид по умолчанию (выбор дней, месяцев, лет)
17
+ */
18
+ defaultView?: View;
19
+ /**
20
+ * Вид шапки — месяц и год или только месяц
21
+ */
22
+ selectorView?: SelectorView;
23
+ /**
24
+ * Выбранная дата (timestamp)
25
+ */
26
+ value?: number;
27
+ /**
28
+ * Открытый месяц (timestamp)
29
+ */
30
+ month?: number;
31
+ /**
32
+ * Месяц, открытый по умолчанию (timestamp)
33
+ */
34
+ defaultMonth?: number;
35
+ /**
36
+ * Минимальная дата, доступная для выбора (timestamp)
37
+ */
38
+ minDate?: number;
39
+ /**
40
+ * Максимальная дата, доступная для выбора (timestamp)
41
+ */
42
+ maxDate?: number;
43
+ /**
44
+ * Начало выделенного периода (timestamp)
45
+ */
46
+ selectedFrom?: number;
47
+ /**
48
+ * Конец выделенного периода (timestamp)
49
+ */
50
+ selectedTo?: number;
51
+ /**
52
+ * Индикатор, что выбран полный период
53
+ */
54
+ rangeComplete?: boolean;
55
+ /**
56
+ * Список событий
57
+ */
58
+ events?: Array<Date | number>;
59
+ /**
60
+ * Список отключенных для выбора дней.
61
+ */
62
+ offDays?: Array<Date | number>;
63
+ /**
64
+ * Список выходных
65
+ */
66
+ holidays?: Array<Date | number>;
67
+ /**
68
+ * Обработчик изменения месяца (или года)
69
+ */
70
+ onMonthChange?: (month: number) => void;
71
+ /**
72
+ * Обработчик выбора даты
73
+ */
74
+ onChange?: (date?: number) => void;
75
+ /**
76
+ * Обработчик нажатия на кнопку месяца
77
+ */
78
+ onMonthClick?: (event: MouseEvent<HTMLButtonElement>) => void;
79
+ /**
80
+ * Обработчик нажатия на кнопку года
81
+ */
82
+ onYearClick?: (event: MouseEvent<HTMLButtonElement>) => void;
83
+ /**
84
+ * Обработчик нажатия на период
85
+ */
86
+ onPeriodClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
87
+ /**
88
+ * Идентификатор для систем автоматизированного тестирования
89
+ */
90
+ dataTestId?: string;
91
+ /**
92
+ * Нужно ли рендерить шапку календаря
93
+ */
94
+ hasHeader?: boolean;
95
+ /**
96
+ * Должен ли календарь подстраиваться под ширину родителя.
97
+ */
98
+ responsive?: boolean;
99
+ /**
100
+ * Дополнительный контент под числом
101
+ */
102
+ dayAddons?: DayAddons[];
103
+ /**
104
+ * Форма ячейки дня
105
+ */
106
+ shape?: "rounded" | "rectangular";
107
+ /**
108
+ * Отображать ли текущий год, если selectorView 'month-only'
109
+ * @default false
110
+ */
111
+ showCurrentYearSelector?: boolean;
112
+ };
113
+ type CalendarWithSkeletonProps = CalendarDesktopProps & {
5
114
  /**
6
115
  * Флаг включения анимации скелета
7
116
  */
@@ -11,7 +120,7 @@ type CalendarWithSkeletonProps = CalendarProps & {
11
120
  */
12
121
  calendarVisible?: boolean;
13
122
  };
14
- declare const CalendarWithSkeleton: React.ForwardRefExoticComponent<CalendarProps & {
123
+ declare const CalendarWithSkeleton: React.ForwardRefExoticComponent<CalendarDesktopProps & {
15
124
  /**
16
125
  * Флаг включения анимации скелета
17
126
  */
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { AnchorButtonProps, NativeButtonProps } from "./typings-9211a437";
4
+ type ButtonDesktopProps = Partial<AnchorButtonProps | NativeButtonProps>;
5
+ declare const ButtonDesktop: React.ForwardRefExoticComponent<ButtonDesktopProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
6
+ export { ButtonDesktopProps, ButtonDesktop };
package/Component.js CHANGED
@@ -6,7 +6,7 @@ var tslib = require('tslib');
6
6
  var React = require('react');
7
7
  var reactTransitionGroup = require('react-transition-group');
8
8
  var cn = require('classnames');
9
- var coreComponentsCalendar = require('@alfalab/core-components-calendar');
9
+ var desktop = require('@alfalab/core-components-calendar/desktop');
10
10
  var coreComponentsSkeleton = require('@alfalab/core-components-skeleton');
11
11
 
12
12
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -14,7 +14,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
14
14
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
15
15
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
16
16
 
17
- var styles = {"component":"calendar-with-skeleton__component_nq0zj","calendarVisible":"calendar-with-skeleton__calendarVisible_nq0zj","skeleton":"calendar-with-skeleton__skeleton_nq0zj","header":"calendar-with-skeleton__header_nq0zj","weekDays":"calendar-with-skeleton__weekDays_nq0zj","row":"calendar-with-skeleton__row_nq0zj","enter":"calendar-with-skeleton__enter_nq0zj","enterActive":"calendar-with-skeleton__enterActive_nq0zj","exit":"calendar-with-skeleton__exit_nq0zj","exitActive":"calendar-with-skeleton__exitActive_nq0zj"};
17
+ var styles = {"component":"calendar-with-skeleton__component_13q2t","calendarVisible":"calendar-with-skeleton__calendarVisible_13q2t","skeleton":"calendar-with-skeleton__skeleton_13q2t","header":"calendar-with-skeleton__header_13q2t","weekDays":"calendar-with-skeleton__weekDays_13q2t","row":"calendar-with-skeleton__row_13q2t","enter":"calendar-with-skeleton__enter_13q2t","enterActive":"calendar-with-skeleton__enterActive_13q2t","exit":"calendar-with-skeleton__exit_13q2t","exitActive":"calendar-with-skeleton__exitActive_13q2t"};
18
18
  require('./index.css')
19
19
 
20
20
  var CalendarWithSkeleton = React.forwardRef(function (_a, ref) {
@@ -24,7 +24,7 @@ var CalendarWithSkeleton = React.forwardRef(function (_a, ref) {
24
24
  return (React__default.default.createElement("div", { className: cn__default.default(styles.component, className, (_b = {},
25
25
  _b[styles.calendarVisible] = calendarVisible,
26
26
  _b)) },
27
- calendarVisible && React__default.default.createElement(coreComponentsCalendar.Calendar, tslib.__assign({ ref: ref, responsive: true }, restProps)),
27
+ calendarVisible && React__default.default.createElement(desktop.CalendarDesktop, tslib.__assign({ ref: ref, responsive: true }, restProps)),
28
28
  React__default.default.createElement(reactTransitionGroup.CSSTransition, { in: !calendarVisible, timeout: 200, unmountOnExit: true, classNames: styles },
29
29
  React__default.default.createElement("div", { className: styles.skeleton, ref: calendarVisible ? undefined : ref },
30
30
  React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles.header })),
@@ -0,0 +1,68 @@
1
+ /// <reference types="react" />
2
+ import React from "react";
3
+ import { FC, ReactNode } from "react";
4
+ import { AnchorButtonProps, NativeButtonProps, ButtonProps } from "./typings-9211a437";
5
+ type ButtonMobileProps = Partial<AnchorButtonProps | NativeButtonProps>;
6
+ declare const ButtonMobile: React.ForwardRefExoticComponent<ButtonMobileProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
7
+ type MqProps = {
8
+ /**
9
+ * Media выражение или кастомный запрос из `mq.json`, например `--mobile`.
10
+ */
11
+ query?: string;
12
+ /**
13
+ * Запрос на поддержку тач-событий
14
+ */
15
+ touch?: boolean;
16
+ /**
17
+ * Дочерние элементы.
18
+ */
19
+ children?: ReactNode;
20
+ /**
21
+ * Обработчик изменений в совпадении запросов
22
+ */
23
+ onMatchChange?: (isMatched: boolean) => void;
24
+ };
25
+ declare const Mq: FC<MqProps>;
26
+ /**
27
+ * Хук для медиа запросов.
28
+ * @param query media выражение или кастомный запрос из `mq.json`, например `--mobile`.
29
+ * @param defaultValue Значение по-умолчанию.
30
+ */
31
+ declare const useMatchMedia: (query: string, defaultValue?: boolean | (() => boolean)) => boolean[];
32
+ /**
33
+ * Возвращает MediaQueryList для заданного media-выражения.
34
+ *
35
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
36
+ */
37
+ declare function getMatchMedia(queryProp: string): MediaQueryList;
38
+ /**
39
+ * Удаляет MediaQueryList.
40
+ *
41
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
42
+ */
43
+ declare function releaseMatchMedia(queryProp: string): void;
44
+ /**
45
+ * Возвращает `true`, если есть поддержка `Pointer Events`
46
+ */
47
+ declare function isPointerEventsSupported(): boolean;
48
+ /**
49
+ * Возвращает `true`, если есть поддержка `Touch Events`
50
+ */
51
+ declare function isTouchSupported(): boolean;
52
+ declare const _exports: {
53
+ "--mobile-xs": string;
54
+ "--mobile-s": string;
55
+ "--mobile-m": string;
56
+ "--mobile-l": string;
57
+ "--mobile": string;
58
+ "--tablet-s": string;
59
+ "--tablet-m": string;
60
+ "--tablet": string;
61
+ "--desktop-s": string;
62
+ "--desktop-m": string;
63
+ "--desktop-l": string;
64
+ "--desktop-xl": string;
65
+ "--desktop": string;
66
+ };
67
+ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
68
+ export { _exports as default, ButtonMobileProps, ButtonMobile, MqProps, Mq, useMatchMedia, getMatchMedia, releaseMatchMedia, isPointerEventsSupported, isTouchSupported, Button };
@@ -0,0 +1,24 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { ButtonHTMLAttributes } from "react";
4
+ type SelectButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
5
+ /**
6
+ * Дополнительный класс
7
+ */
8
+ className?: string;
9
+ /**
10
+ * Вид кнопки
11
+ */
12
+ view?: 'default' | 'filled' | 'outlined' | 'selected';
13
+ };
14
+ declare const SelectButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
15
+ /**
16
+ * Дополнительный класс
17
+ */
18
+ className?: string | undefined;
19
+ /**
20
+ * Вид кнопки
21
+ */
22
+ view?: "default" | "outlined" | "filled" | "selected" | undefined;
23
+ } & React.RefAttributes<HTMLButtonElement>>;
24
+ export { SelectButtonProps, SelectButton };
@@ -1,7 +1,116 @@
1
1
  /// <reference types="react" />
2
2
  import React from 'react';
3
- import { CalendarProps } from "@alfalab/core-components-calendar";
4
- type CalendarWithSkeletonProps = CalendarProps & {
3
+ import { MouseEvent, ReactNode } from "react";
4
+ type DayAddons = {
5
+ date: Date | number;
6
+ addon: ReactNode;
7
+ };
8
+ type View = "years" | "months" | "days";
9
+ type SelectorView = "month-only" | "full";
10
+ type CalendarDesktopProps = {
11
+ /**
12
+ * Дополнительный класс
13
+ */
14
+ className?: string;
15
+ /**
16
+ * Вид по умолчанию (выбор дней, месяцев, лет)
17
+ */
18
+ defaultView?: View;
19
+ /**
20
+ * Вид шапки — месяц и год или только месяц
21
+ */
22
+ selectorView?: SelectorView;
23
+ /**
24
+ * Выбранная дата (timestamp)
25
+ */
26
+ value?: number;
27
+ /**
28
+ * Открытый месяц (timestamp)
29
+ */
30
+ month?: number;
31
+ /**
32
+ * Месяц, открытый по умолчанию (timestamp)
33
+ */
34
+ defaultMonth?: number;
35
+ /**
36
+ * Минимальная дата, доступная для выбора (timestamp)
37
+ */
38
+ minDate?: number;
39
+ /**
40
+ * Максимальная дата, доступная для выбора (timestamp)
41
+ */
42
+ maxDate?: number;
43
+ /**
44
+ * Начало выделенного периода (timestamp)
45
+ */
46
+ selectedFrom?: number;
47
+ /**
48
+ * Конец выделенного периода (timestamp)
49
+ */
50
+ selectedTo?: number;
51
+ /**
52
+ * Индикатор, что выбран полный период
53
+ */
54
+ rangeComplete?: boolean;
55
+ /**
56
+ * Список событий
57
+ */
58
+ events?: Array<Date | number>;
59
+ /**
60
+ * Список отключенных для выбора дней.
61
+ */
62
+ offDays?: Array<Date | number>;
63
+ /**
64
+ * Список выходных
65
+ */
66
+ holidays?: Array<Date | number>;
67
+ /**
68
+ * Обработчик изменения месяца (или года)
69
+ */
70
+ onMonthChange?: (month: number) => void;
71
+ /**
72
+ * Обработчик выбора даты
73
+ */
74
+ onChange?: (date?: number) => void;
75
+ /**
76
+ * Обработчик нажатия на кнопку месяца
77
+ */
78
+ onMonthClick?: (event: MouseEvent<HTMLButtonElement>) => void;
79
+ /**
80
+ * Обработчик нажатия на кнопку года
81
+ */
82
+ onYearClick?: (event: MouseEvent<HTMLButtonElement>) => void;
83
+ /**
84
+ * Обработчик нажатия на период
85
+ */
86
+ onPeriodClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
87
+ /**
88
+ * Идентификатор для систем автоматизированного тестирования
89
+ */
90
+ dataTestId?: string;
91
+ /**
92
+ * Нужно ли рендерить шапку календаря
93
+ */
94
+ hasHeader?: boolean;
95
+ /**
96
+ * Должен ли календарь подстраиваться под ширину родителя.
97
+ */
98
+ responsive?: boolean;
99
+ /**
100
+ * Дополнительный контент под числом
101
+ */
102
+ dayAddons?: DayAddons[];
103
+ /**
104
+ * Форма ячейки дня
105
+ */
106
+ shape?: "rounded" | "rectangular";
107
+ /**
108
+ * Отображать ли текущий год, если selectorView 'month-only'
109
+ * @default false
110
+ */
111
+ showCurrentYearSelector?: boolean;
112
+ };
113
+ type CalendarWithSkeletonProps = CalendarDesktopProps & {
5
114
  /**
6
115
  * Флаг включения анимации скелета
7
116
  */
@@ -11,7 +120,7 @@ type CalendarWithSkeletonProps = CalendarProps & {
11
120
  */
12
121
  calendarVisible?: boolean;
13
122
  };
14
- declare const CalendarWithSkeleton: React.ForwardRefExoticComponent<CalendarProps & {
123
+ declare const CalendarWithSkeleton: React.ForwardRefExoticComponent<CalendarDesktopProps & {
15
124
  /**
16
125
  * Флаг включения анимации скелета
17
126
  */
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import React from 'react';
3
+ import { AnchorButtonProps, NativeButtonProps } from "./typings-9211a437";
4
+ type ButtonDesktopProps = Partial<AnchorButtonProps | NativeButtonProps>;
5
+ declare const ButtonDesktop: React.ForwardRefExoticComponent<ButtonDesktopProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
6
+ export { ButtonDesktopProps, ButtonDesktop };
package/cssm/Component.js CHANGED
@@ -6,7 +6,7 @@ var tslib = require('tslib');
6
6
  var React = require('react');
7
7
  var reactTransitionGroup = require('react-transition-group');
8
8
  var cn = require('classnames');
9
- var coreComponentsCalendar = require('@alfalab/core-components-calendar/cssm');
9
+ var desktop = require('@alfalab/core-components-calendar/cssm/desktop');
10
10
  var coreComponentsSkeleton = require('@alfalab/core-components-skeleton/cssm');
11
11
  var styles = require('./index.module.css');
12
12
 
@@ -23,7 +23,7 @@ var CalendarWithSkeleton = React.forwardRef(function (_a, ref) {
23
23
  return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, className, (_b = {},
24
24
  _b[styles__default.default.calendarVisible] = calendarVisible,
25
25
  _b)) },
26
- calendarVisible && React__default.default.createElement(coreComponentsCalendar.Calendar, tslib.__assign({ ref: ref, responsive: true }, restProps)),
26
+ calendarVisible && React__default.default.createElement(desktop.CalendarDesktop, tslib.__assign({ ref: ref, responsive: true }, restProps)),
27
27
  React__default.default.createElement(reactTransitionGroup.CSSTransition, { in: !calendarVisible, timeout: 200, unmountOnExit: true, classNames: styles__default.default },
28
28
  React__default.default.createElement("div", { className: styles__default.default.skeleton, ref: calendarVisible ? undefined : ref },
29
29
  React__default.default.createElement(coreComponentsSkeleton.Skeleton, tslib.__assign({}, skeletonProps, { className: styles__default.default.header })),
@@ -0,0 +1,68 @@
1
+ /// <reference types="react" />
2
+ import React from "react";
3
+ import { FC, ReactNode } from "react";
4
+ import { AnchorButtonProps, NativeButtonProps, ButtonProps } from "./typings-9211a437";
5
+ type ButtonMobileProps = Partial<AnchorButtonProps | NativeButtonProps>;
6
+ declare const ButtonMobile: React.ForwardRefExoticComponent<ButtonMobileProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
7
+ type MqProps = {
8
+ /**
9
+ * Media выражение или кастомный запрос из `mq.json`, например `--mobile`.
10
+ */
11
+ query?: string;
12
+ /**
13
+ * Запрос на поддержку тач-событий
14
+ */
15
+ touch?: boolean;
16
+ /**
17
+ * Дочерние элементы.
18
+ */
19
+ children?: ReactNode;
20
+ /**
21
+ * Обработчик изменений в совпадении запросов
22
+ */
23
+ onMatchChange?: (isMatched: boolean) => void;
24
+ };
25
+ declare const Mq: FC<MqProps>;
26
+ /**
27
+ * Хук для медиа запросов.
28
+ * @param query media выражение или кастомный запрос из `mq.json`, например `--mobile`.
29
+ * @param defaultValue Значение по-умолчанию.
30
+ */
31
+ declare const useMatchMedia: (query: string, defaultValue?: boolean | (() => boolean)) => boolean[];
32
+ /**
33
+ * Возвращает MediaQueryList для заданного media-выражения.
34
+ *
35
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
36
+ */
37
+ declare function getMatchMedia(queryProp: string): MediaQueryList;
38
+ /**
39
+ * Удаляет MediaQueryList.
40
+ *
41
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
42
+ */
43
+ declare function releaseMatchMedia(queryProp: string): void;
44
+ /**
45
+ * Возвращает `true`, если есть поддержка `Pointer Events`
46
+ */
47
+ declare function isPointerEventsSupported(): boolean;
48
+ /**
49
+ * Возвращает `true`, если есть поддержка `Touch Events`
50
+ */
51
+ declare function isTouchSupported(): boolean;
52
+ declare const _exports: {
53
+ "--mobile-xs": string;
54
+ "--mobile-s": string;
55
+ "--mobile-m": string;
56
+ "--mobile-l": string;
57
+ "--mobile": string;
58
+ "--tablet-s": string;
59
+ "--tablet-m": string;
60
+ "--tablet": string;
61
+ "--desktop-s": string;
62
+ "--desktop-m": string;
63
+ "--desktop-l": string;
64
+ "--desktop-xl": string;
65
+ "--desktop": string;
66
+ };
67
+ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
68
+ export { _exports as default, ButtonMobileProps, ButtonMobile, MqProps, Mq, useMatchMedia, getMatchMedia, releaseMatchMedia, isPointerEventsSupported, isTouchSupported, Button };
@@ -0,0 +1,2 @@
1
+ export * from "./Component.desktop-2e2b2125";
2
+ export {};
@@ -0,0 +1,2 @@
1
+ export { Button } from "./Component.responsive-2e2b2125";
2
+ export type { ButtonProps } from "./typings-9211a437";
@@ -0,0 +1,42 @@
1
+ /// <reference types="react" />
2
+ // TODO Вид кнопок зависит от порядка импорта стилей.
3
+ /* eslint-disable simple-import-sort/imports */
4
+ import React from "react";
5
+ import { FC } from "react";
6
+ import { BaseButtonProps } from "./typings-9211a437";
7
+ /**
8
+ * Минимальное время отображения лоадера - 500мс,
9
+ * чтобы при быстрых ответах от сервера кнопка не «моргала».
10
+ */
11
+ declare const LOADER_MIN_DISPLAY_INTERVAL = 500;
12
+ declare const BaseButton: React.ForwardRefExoticComponent<BaseButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
13
+ type SpinnerProps = {
14
+ /**
15
+ * Управление видимостью компонента
16
+ */
17
+ visible?: boolean;
18
+ /**
19
+ * Размер компонента
20
+ */
21
+ size?: "xs" | "s" | "m";
22
+ /**
23
+ * Дополнительный класс
24
+ */
25
+ className?: string;
26
+ /**
27
+ * Идентификатор компонента в DOM
28
+ */
29
+ id?: string;
30
+ /**
31
+ * Идентификатор для систем автоматизированного тестирования
32
+ */
33
+ dataTestId?: string;
34
+ /**
35
+ * Палитра, в контексте которой используется спиннер
36
+ */
37
+ colors?: "default" | "inverted";
38
+ };
39
+ declare const Spinner: FC<SpinnerProps>;
40
+ declare const isClient: () => boolean;
41
+ declare const getDataTestId: (dataTestId?: string, element?: string) => string | undefined;
42
+ export { LOADER_MIN_DISPLAY_INTERVAL, BaseButton, SpinnerProps, Spinner, isClient, getDataTestId };
package/cssm/index.js CHANGED
@@ -7,7 +7,7 @@ require('tslib');
7
7
  require('react');
8
8
  require('react-transition-group');
9
9
  require('classnames');
10
- require('@alfalab/core-components-calendar/cssm');
10
+ require('@alfalab/core-components-calendar/cssm/desktop');
11
11
  require('@alfalab/core-components-skeleton/cssm');
12
12
  require('./index.module.css');
13
13
 
@@ -0,0 +1,95 @@
1
+ import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, ReactNode } from 'react';
2
+ type StyleColors = {
3
+ default: {
4
+ [key: string]: string;
5
+ };
6
+ inverted: {
7
+ [key: string]: string;
8
+ };
9
+ };
10
+ type ComponentProps = {
11
+ /**
12
+ * Тип кнопки
13
+ * @default secondary
14
+ */
15
+ view?: 'accent' | 'primary' | 'secondary' | 'tertiary' | 'outlined' | 'filled' | 'transparent' | 'link' | 'ghost';
16
+ /**
17
+ * Слот слева
18
+ */
19
+ leftAddons?: ReactNode;
20
+ /**
21
+ * Слот справа
22
+ */
23
+ rightAddons?: ReactNode;
24
+ /**
25
+ * Размер компонента
26
+ * @default m
27
+ */
28
+ size?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
29
+ /**
30
+ * Растягивает компонент на ширину контейнера
31
+ * @default false
32
+ */
33
+ block?: boolean;
34
+ /**
35
+ * Дополнительный класс
36
+ */
37
+ className?: string;
38
+ /**
39
+ * Дополнительный класс для спиннера
40
+ */
41
+ spinnerClassName?: string;
42
+ /**
43
+ * Выводит ссылку в виде кнопки
44
+ */
45
+ href?: string;
46
+ /**
47
+ * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
48
+ */
49
+ Component?: ElementType;
50
+ /**
51
+ * Идентификатор для систем автоматизированного тестирования
52
+ */
53
+ dataTestId?: string;
54
+ /**
55
+ * Показать лоадер
56
+ * @default false
57
+ */
58
+ loading?: boolean;
59
+ /**
60
+ * Не переносить текст кнопки на новую строку
61
+ * @default false
62
+ */
63
+ nowrap?: boolean;
64
+ /**
65
+ * Набор цветов для компонента
66
+ */
67
+ colors?: 'default' | 'inverted';
68
+ /**
69
+ * Дочерние элементы.
70
+ */
71
+ children?: ReactNode;
72
+ /**
73
+ * Основные стили компонента.
74
+ */
75
+ styles: {
76
+ [key: string]: string;
77
+ };
78
+ /**
79
+ * Стили компонента для default и inverted режима.
80
+ */
81
+ colorStylesMap: StyleColors;
82
+ };
83
+ type AnchorBaseButtonProps = ComponentProps & AnchorHTMLAttributes<HTMLAnchorElement>;
84
+ type NativeBaseButtonProps = ComponentProps & ButtonHTMLAttributes<HTMLButtonElement>;
85
+ type BaseButtonProps = Partial<AnchorBaseButtonProps | NativeBaseButtonProps>;
86
+ type AnchorButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & AnchorHTMLAttributes<HTMLAnchorElement>;
87
+ type NativeButtonProps = Omit<BaseButtonProps, 'styles' | 'colorStylesMap'> & ButtonHTMLAttributes<HTMLButtonElement>;
88
+ type ButtonProps = Partial<AnchorButtonProps | NativeButtonProps> & {
89
+ /**
90
+ * Контрольная точка, с нее начинается desktop версия
91
+ * @default 1024
92
+ */
93
+ breakpoint?: number;
94
+ };
95
+ export { StyleColors, ComponentProps, AnchorBaseButtonProps, NativeBaseButtonProps, BaseButtonProps, AnchorButtonProps, NativeButtonProps, ButtonProps };
@@ -0,0 +1,2 @@
1
+ export * from "./Component.desktop-2e2b2125";
2
+ export {};