@alfalab/core-components-date-range-input 3.0.1 → 3.0.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.
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
3
  import { FC, ForwardRefExoticComponent, RefAttributes, HTMLAttributes } from "react";
4
+ import { TextElementType, TextSkeletonProps } from "./types-1b036d4b";
4
5
  declare const colors: readonly [
5
6
  "tertiary",
6
7
  "disabled",
@@ -23,7 +24,6 @@ declare const colors: readonly [
23
24
  "static-accent"
24
25
  ];
25
26
  type Color = (typeof colors)[number];
26
- type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
27
27
  type NativeProps = HTMLAttributes<HTMLSpanElement>;
28
28
  type TextBaseProps = {
29
29
  /**
@@ -66,6 +66,14 @@ type TextBaseProps = {
66
66
  * Количество строк (не поддерживает IE)
67
67
  */
68
68
  rowLimit?: 1 | 2 | 3;
69
+ /**
70
+ * Показать скелетон
71
+ */
72
+ showSkeleton?: boolean;
73
+ /**
74
+ * Пропы для скелетона
75
+ */
76
+ skeletonProps?: TextSkeletonProps;
69
77
  };
70
78
  type TextPTagProps = Omit<TextBaseProps, "tag" | "defaultMargins"> & {
71
79
  tag?: "p";
@@ -114,6 +122,14 @@ type TitleProps = Omit<NativeProps$0, "color"> & {
114
122
  * Количество строк (не поддерживает IE)
115
123
  */
116
124
  rowLimit?: 1 | 2 | 3;
125
+ /**
126
+ * Показать скелетон
127
+ */
128
+ showSkeleton?: boolean;
129
+ /**
130
+ * Пропы для скелетона
131
+ */
132
+ skeletonProps?: TextSkeletonProps;
117
133
  };
118
134
  type TitleMobileProps = Omit<TitleProps, "defaultMargins">;
119
135
  declare const Typography: {
@@ -165,3 +181,4 @@ interface BackArrowAddonProps extends React.HTMLAttributes<HTMLButtonElement> {
165
181
  declare const BackArrowAddon: React.FC<BackArrowAddonProps>;
166
182
  export { Typography, typographyPresets, TitleResponsive, BackArrowAddonProps, BackArrowAddon };
167
183
  export type { TitleProps, TextProps, Color };
184
+ export * from "./useSkeleton-1b036d4b";
@@ -23,7 +23,7 @@ var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
23
23
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
24
24
  var dateFnsIsValid__default = /*#__PURE__*/_interopDefaultCompat(dateFnsIsValid);
25
25
 
26
- var styles = {"component":"date-range-input__component_1c20z","calendarContainer":"date-range-input__calendarContainer_1c20z","calendarResponsive":"date-range-input__calendarResponsive_1c20z","block":"date-range-input__block_1c20z","calendarIcon":"date-range-input__calendarIcon_1c20z"};
26
+ var styles = {"component":"date-range-input__component_1s5dy","calendarContainer":"date-range-input__calendarContainer_1s5dy","calendarResponsive":"date-range-input__calendarResponsive_1s5dy","block":"date-range-input__block_1s5dy","calendarIcon":"date-range-input__calendarIcon_1s5dy"};
27
27
  require('./index.css')
28
28
 
29
29
  var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
@@ -196,9 +196,7 @@ var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
196
196
  resetPeriod();
197
197
  };
198
198
  var handleCalendarChange = function (date) {
199
- if (date) {
200
- updatePeriod(date);
201
- }
199
+ updatePeriod(date);
202
200
  };
203
201
  var handleCalendarWrapperMouseDown = function (event) {
204
202
  // Не дает инпуту терять фокус при выборе даты
@@ -1,4 +1,4 @@
1
- /* hash: 8gfu6 */
1
+ /* hash: hu6uq */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-border-secondary: #e9e9eb; /* 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 */
@@ -41,24 +41,24 @@
41
41
  /* marker */
42
42
  } :root {
43
43
  --calendar-popover-border-radius: var(--border-radius-m);
44
- } .date-range-input__component_1c20z {
44
+ } .date-range-input__component_1s5dy {
45
45
  display: inline-block;
46
46
  outline: none;
47
47
  position: relative;
48
- } .date-range-input__calendarContainer_1c20z {
48
+ } .date-range-input__calendarContainer_1s5dy {
49
49
  display: inline-block;
50
50
  box-sizing: border-box;
51
51
  border-radius: var(--calendar-popover-border-radius);
52
52
  border: 1px solid var(--color-light-border-secondary)
53
- } @media (max-width: 374px) { .date-range-input__calendarContainer_1c20z {
53
+ } @media (max-width: 374px) { .date-range-input__calendarContainer_1s5dy {
54
54
  width: 100%;
55
55
  min-width: 288px
56
56
  }
57
- } .date-range-input__calendarResponsive_1c20z {
57
+ } .date-range-input__calendarResponsive_1s5dy {
58
58
  width: var(--calendar-width);
59
- } .date-range-input__block_1c20z {
59
+ } .date-range-input__block_1s5dy {
60
60
  width: 100%;
61
- } .date-range-input__calendarIcon_1c20z {
61
+ } .date-range-input__calendarIcon_1s5dy {
62
62
  margin-right: var(--gap-s-neg);
63
63
  height: 100%;
64
64
  }
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
3
  import { FC, ForwardRefExoticComponent, RefAttributes, HTMLAttributes } from "react";
4
+ import { TextElementType, TextSkeletonProps } from "./types-1b036d4b";
4
5
  declare const colors: readonly [
5
6
  "tertiary",
6
7
  "disabled",
@@ -23,7 +24,6 @@ declare const colors: readonly [
23
24
  "static-accent"
24
25
  ];
25
26
  type Color = (typeof colors)[number];
26
- type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
27
27
  type NativeProps = HTMLAttributes<HTMLSpanElement>;
28
28
  type TextBaseProps = {
29
29
  /**
@@ -66,6 +66,14 @@ type TextBaseProps = {
66
66
  * Количество строк (не поддерживает IE)
67
67
  */
68
68
  rowLimit?: 1 | 2 | 3;
69
+ /**
70
+ * Показать скелетон
71
+ */
72
+ showSkeleton?: boolean;
73
+ /**
74
+ * Пропы для скелетона
75
+ */
76
+ skeletonProps?: TextSkeletonProps;
69
77
  };
70
78
  type TextPTagProps = Omit<TextBaseProps, "tag" | "defaultMargins"> & {
71
79
  tag?: "p";
@@ -114,6 +122,14 @@ type TitleProps = Omit<NativeProps$0, "color"> & {
114
122
  * Количество строк (не поддерживает IE)
115
123
  */
116
124
  rowLimit?: 1 | 2 | 3;
125
+ /**
126
+ * Показать скелетон
127
+ */
128
+ showSkeleton?: boolean;
129
+ /**
130
+ * Пропы для скелетона
131
+ */
132
+ skeletonProps?: TextSkeletonProps;
117
133
  };
118
134
  type TitleMobileProps = Omit<TitleProps, "defaultMargins">;
119
135
  declare const Typography: {
@@ -165,3 +181,4 @@ interface BackArrowAddonProps extends React.HTMLAttributes<HTMLButtonElement> {
165
181
  declare const BackArrowAddon: React.FC<BackArrowAddonProps>;
166
182
  export { Typography, typographyPresets, TitleResponsive, BackArrowAddonProps, BackArrowAddon };
167
183
  export type { TitleProps, TextProps, Color };
184
+ export * from "./useSkeleton-1b036d4b";
@@ -195,9 +195,7 @@ var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
195
195
  resetPeriod();
196
196
  };
197
197
  var handleCalendarChange = function (date) {
198
- if (date) {
199
- updatePeriod(date);
200
- }
198
+ updatePeriod(date);
201
199
  };
202
200
  var handleCalendarWrapperMouseDown = function (event) {
203
201
  // Не дает инпуту терять фокус при выборе даты
@@ -0,0 +1,13 @@
1
+ type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
2
+ type WidthUnit = number | string;
3
+ type TextSkeletonProps = {
4
+ /**
5
+ * Кол-во строк текста
6
+ */
7
+ rows?: number;
8
+ /**
9
+ * Ширина строки
10
+ */
11
+ width?: WidthUnit | WidthUnit[];
12
+ };
13
+ export { TextElementType, TextSkeletonProps };
@@ -0,0 +1,40 @@
1
+ /// <reference types="react" />
2
+ import React from "react";
3
+ import { ReactNode } from "react";
4
+ import { TextSkeletonProps } from "./types-1b036d4b";
5
+ type SkeletonProps = {
6
+ /**
7
+ * Флаг, явно задающий состояние, при котором контент закрывается прелоадером
8
+ */
9
+ visible?: boolean;
10
+ /**
11
+ * Флаг явного включения анимации скелета
12
+ */
13
+ animate?: boolean;
14
+ /**
15
+ * Дополнительный класс
16
+ */
17
+ className?: string;
18
+ /**
19
+ * Дополнительные инлайн стили
20
+ */
21
+ style?: React.CSSProperties;
22
+ /**
23
+ * Идентификатор для систем автоматизированного тестирования
24
+ */
25
+ dataTestId?: string;
26
+ /**
27
+ * Дочерние элементы.
28
+ */
29
+ children?: ReactNode;
30
+ };
31
+ declare const Skeleton: React.FC<SkeletonProps>;
32
+ type SkeletonProps$0 = {
33
+ wrapperClassName?: string;
34
+ dataTestId?: string;
35
+ };
36
+ declare function useSkeleton(showSkeleton?: boolean, skeletonProps?: TextSkeletonProps): {
37
+ renderSkeleton: (props: SkeletonProps$0) => React.JSX.Element | null;
38
+ textRef: React.RefObject<HTMLElement>;
39
+ };
40
+ export { SkeletonProps, Skeleton, useSkeleton };
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
3
  import { FC, ForwardRefExoticComponent, RefAttributes, HTMLAttributes } from "react";
4
+ import { TextElementType, TextSkeletonProps } from "./types-1b036d4b";
4
5
  declare const colors: readonly [
5
6
  "tertiary",
6
7
  "disabled",
@@ -23,7 +24,6 @@ declare const colors: readonly [
23
24
  "static-accent"
24
25
  ];
25
26
  type Color = (typeof colors)[number];
26
- type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
27
27
  type NativeProps = HTMLAttributes<HTMLSpanElement>;
28
28
  type TextBaseProps = {
29
29
  /**
@@ -66,6 +66,14 @@ type TextBaseProps = {
66
66
  * Количество строк (не поддерживает IE)
67
67
  */
68
68
  rowLimit?: 1 | 2 | 3;
69
+ /**
70
+ * Показать скелетон
71
+ */
72
+ showSkeleton?: boolean;
73
+ /**
74
+ * Пропы для скелетона
75
+ */
76
+ skeletonProps?: TextSkeletonProps;
69
77
  };
70
78
  type TextPTagProps = Omit<TextBaseProps, "tag" | "defaultMargins"> & {
71
79
  tag?: "p";
@@ -114,6 +122,14 @@ type TitleProps = Omit<NativeProps$0, "color"> & {
114
122
  * Количество строк (не поддерживает IE)
115
123
  */
116
124
  rowLimit?: 1 | 2 | 3;
125
+ /**
126
+ * Показать скелетон
127
+ */
128
+ showSkeleton?: boolean;
129
+ /**
130
+ * Пропы для скелетона
131
+ */
132
+ skeletonProps?: TextSkeletonProps;
117
133
  };
118
134
  type TitleMobileProps = Omit<TitleProps, "defaultMargins">;
119
135
  declare const Typography: {
@@ -165,3 +181,4 @@ interface BackArrowAddonProps extends React.HTMLAttributes<HTMLButtonElement> {
165
181
  declare const BackArrowAddon: React.FC<BackArrowAddonProps>;
166
182
  export { Typography, typographyPresets, TitleResponsive, BackArrowAddonProps, BackArrowAddon };
167
183
  export type { TitleProps, TextProps, Color };
184
+ export * from "./useSkeleton-1b036d4b";
@@ -12,7 +12,7 @@ import { CalendarMIcon } from '@alfalab/icons-glyph/CalendarMIcon';
12
12
  import { parseTimestampToDate, DATE_FORMAT, format, parseDateString, DATE_MASK, isCompleteDateInput, isValid } from '../../utils/format.js';
13
13
  import 'date-fns/parse';
14
14
 
15
- var styles = {"component":"date-range-input__component_1c20z","calendarContainer":"date-range-input__calendarContainer_1c20z","calendarResponsive":"date-range-input__calendarResponsive_1c20z","block":"date-range-input__block_1c20z","calendarIcon":"date-range-input__calendarIcon_1c20z"};
15
+ var styles = {"component":"date-range-input__component_1s5dy","calendarContainer":"date-range-input__calendarContainer_1s5dy","calendarResponsive":"date-range-input__calendarResponsive_1s5dy","block":"date-range-input__block_1s5dy","calendarIcon":"date-range-input__calendarIcon_1s5dy"};
16
16
  require('./index.css')
17
17
 
18
18
  var DateRangeInput = React.forwardRef(function (_a, ref) {
@@ -185,9 +185,7 @@ var DateRangeInput = React.forwardRef(function (_a, ref) {
185
185
  resetPeriod();
186
186
  };
187
187
  var handleCalendarChange = function (date) {
188
- if (date) {
189
- updatePeriod(date);
190
- }
188
+ updatePeriod(date);
191
189
  };
192
190
  var handleCalendarWrapperMouseDown = function (event) {
193
191
  // Не дает инпуту терять фокус при выборе даты
@@ -1,4 +1,4 @@
1
- /* hash: 8gfu6 */
1
+ /* hash: hu6uq */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-border-secondary: #e9e9eb; /* 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 */
@@ -41,24 +41,24 @@
41
41
  /* marker */
42
42
  } :root {
43
43
  --calendar-popover-border-radius: var(--border-radius-m);
44
- } .date-range-input__component_1c20z {
44
+ } .date-range-input__component_1s5dy {
45
45
  display: inline-block;
46
46
  outline: none;
47
47
  position: relative;
48
- } .date-range-input__calendarContainer_1c20z {
48
+ } .date-range-input__calendarContainer_1s5dy {
49
49
  display: inline-block;
50
50
  box-sizing: border-box;
51
51
  border-radius: var(--calendar-popover-border-radius);
52
52
  border: 1px solid var(--color-light-border-secondary)
53
- } @media (max-width: 374px) { .date-range-input__calendarContainer_1c20z {
53
+ } @media (max-width: 374px) { .date-range-input__calendarContainer_1s5dy {
54
54
  width: 100%;
55
55
  min-width: 288px
56
56
  }
57
- } .date-range-input__calendarResponsive_1c20z {
57
+ } .date-range-input__calendarResponsive_1s5dy {
58
58
  width: var(--calendar-width);
59
- } .date-range-input__block_1c20z {
59
+ } .date-range-input__block_1s5dy {
60
60
  width: 100%;
61
- } .date-range-input__calendarIcon_1c20z {
61
+ } .date-range-input__calendarIcon_1s5dy {
62
62
  margin-right: var(--gap-s-neg);
63
63
  height: 100%;
64
64
  }
@@ -0,0 +1,13 @@
1
+ type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
2
+ type WidthUnit = number | string;
3
+ type TextSkeletonProps = {
4
+ /**
5
+ * Кол-во строк текста
6
+ */
7
+ rows?: number;
8
+ /**
9
+ * Ширина строки
10
+ */
11
+ width?: WidthUnit | WidthUnit[];
12
+ };
13
+ export { TextElementType, TextSkeletonProps };
@@ -0,0 +1,40 @@
1
+ /// <reference types="react" />
2
+ import React from "react";
3
+ import { ReactNode } from "react";
4
+ import { TextSkeletonProps } from "./types-1b036d4b";
5
+ type SkeletonProps = {
6
+ /**
7
+ * Флаг, явно задающий состояние, при котором контент закрывается прелоадером
8
+ */
9
+ visible?: boolean;
10
+ /**
11
+ * Флаг явного включения анимации скелета
12
+ */
13
+ animate?: boolean;
14
+ /**
15
+ * Дополнительный класс
16
+ */
17
+ className?: string;
18
+ /**
19
+ * Дополнительные инлайн стили
20
+ */
21
+ style?: React.CSSProperties;
22
+ /**
23
+ * Идентификатор для систем автоматизированного тестирования
24
+ */
25
+ dataTestId?: string;
26
+ /**
27
+ * Дочерние элементы.
28
+ */
29
+ children?: ReactNode;
30
+ };
31
+ declare const Skeleton: React.FC<SkeletonProps>;
32
+ type SkeletonProps$0 = {
33
+ wrapperClassName?: string;
34
+ dataTestId?: string;
35
+ };
36
+ declare function useSkeleton(showSkeleton?: boolean, skeletonProps?: TextSkeletonProps): {
37
+ renderSkeleton: (props: SkeletonProps$0) => React.JSX.Element | null;
38
+ textRef: React.RefObject<HTMLElement>;
39
+ };
40
+ export { SkeletonProps, Skeleton, useSkeleton };
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
3
  import { FC, ForwardRefExoticComponent, RefAttributes, HTMLAttributes } from "react";
4
+ import { TextElementType, TextSkeletonProps } from "./types-1b036d4b";
4
5
  declare const colors: readonly [
5
6
  "tertiary",
6
7
  "disabled",
@@ -23,7 +24,6 @@ declare const colors: readonly [
23
24
  "static-accent"
24
25
  ];
25
26
  type Color = (typeof colors)[number];
26
- type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
27
27
  type NativeProps = HTMLAttributes<HTMLSpanElement>;
28
28
  type TextBaseProps = {
29
29
  /**
@@ -66,6 +66,14 @@ type TextBaseProps = {
66
66
  * Количество строк (не поддерживает IE)
67
67
  */
68
68
  rowLimit?: 1 | 2 | 3;
69
+ /**
70
+ * Показать скелетон
71
+ */
72
+ showSkeleton?: boolean;
73
+ /**
74
+ * Пропы для скелетона
75
+ */
76
+ skeletonProps?: TextSkeletonProps;
69
77
  };
70
78
  type TextPTagProps = Omit<TextBaseProps, "tag" | "defaultMargins"> & {
71
79
  tag?: "p";
@@ -114,6 +122,14 @@ type TitleProps = Omit<NativeProps$0, "color"> & {
114
122
  * Количество строк (не поддерживает IE)
115
123
  */
116
124
  rowLimit?: 1 | 2 | 3;
125
+ /**
126
+ * Показать скелетон
127
+ */
128
+ showSkeleton?: boolean;
129
+ /**
130
+ * Пропы для скелетона
131
+ */
132
+ skeletonProps?: TextSkeletonProps;
117
133
  };
118
134
  type TitleMobileProps = Omit<TitleProps, "defaultMargins">;
119
135
  declare const Typography: {
@@ -165,3 +181,4 @@ interface BackArrowAddonProps extends React.HTMLAttributes<HTMLButtonElement> {
165
181
  declare const BackArrowAddon: React.FC<BackArrowAddonProps>;
166
182
  export { Typography, typographyPresets, TitleResponsive, BackArrowAddonProps, BackArrowAddon };
167
183
  export type { TitleProps, TextProps, Color };
184
+ export * from "./useSkeleton-1b036d4b";
@@ -11,7 +11,7 @@ import { CalendarMIcon } from '@alfalab/icons-glyph/CalendarMIcon';
11
11
  import { parseTimestampToDate, DATE_FORMAT, format, parseDateString, DATE_MASK, isCompleteDateInput, isValid } from '../../utils/format.js';
12
12
  import 'date-fns/parse';
13
13
 
14
- const styles = {"component":"date-range-input__component_1c20z","calendarContainer":"date-range-input__calendarContainer_1c20z","calendarResponsive":"date-range-input__calendarResponsive_1c20z","block":"date-range-input__block_1c20z","calendarIcon":"date-range-input__calendarIcon_1c20z"};
14
+ const styles = {"component":"date-range-input__component_1s5dy","calendarContainer":"date-range-input__calendarContainer_1s5dy","calendarResponsive":"date-range-input__calendarResponsive_1s5dy","block":"date-range-input__block_1s5dy","calendarIcon":"date-range-input__calendarIcon_1s5dy"};
15
15
  require('./index.css')
16
16
 
17
17
  /* eslint-disable no-useless-escape, jsx-a11y/click-events-have-key-events */
@@ -179,9 +179,7 @@ const DateRangeInput = React.forwardRef(({ className, inputClassName, popoverCla
179
179
  resetPeriod();
180
180
  };
181
181
  const handleCalendarChange = (date) => {
182
- if (date) {
183
- updatePeriod(date);
184
- }
182
+ updatePeriod(date);
185
183
  };
186
184
  const handleCalendarWrapperMouseDown = (event) => {
187
185
  // Не дает инпуту терять фокус при выборе даты
@@ -1,4 +1,4 @@
1
- /* hash: 8gfu6 */
1
+ /* hash: hu6uq */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-border-secondary: #e9e9eb; /* 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 */
@@ -41,24 +41,24 @@
41
41
  /* marker */
42
42
  } :root {
43
43
  --calendar-popover-border-radius: var(--border-radius-m);
44
- } .date-range-input__component_1c20z {
44
+ } .date-range-input__component_1s5dy {
45
45
  display: inline-block;
46
46
  outline: none;
47
47
  position: relative;
48
- } .date-range-input__calendarContainer_1c20z {
48
+ } .date-range-input__calendarContainer_1s5dy {
49
49
  display: inline-block;
50
50
  box-sizing: border-box;
51
51
  border-radius: var(--calendar-popover-border-radius);
52
52
  border: 1px solid var(--color-light-border-secondary)
53
- } @media (max-width: 374px) { .date-range-input__calendarContainer_1c20z {
53
+ } @media (max-width: 374px) { .date-range-input__calendarContainer_1s5dy {
54
54
  width: 100%;
55
55
  min-width: 288px
56
56
  }
57
- } .date-range-input__calendarResponsive_1c20z {
57
+ } .date-range-input__calendarResponsive_1s5dy {
58
58
  width: var(--calendar-width);
59
- } .date-range-input__block_1c20z {
59
+ } .date-range-input__block_1s5dy {
60
60
  width: 100%;
61
- } .date-range-input__calendarIcon_1c20z {
61
+ } .date-range-input__calendarIcon_1s5dy {
62
62
  margin-right: var(--gap-s-neg);
63
63
  height: 100%;
64
64
  }
@@ -0,0 +1,13 @@
1
+ type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
2
+ type WidthUnit = number | string;
3
+ type TextSkeletonProps = {
4
+ /**
5
+ * Кол-во строк текста
6
+ */
7
+ rows?: number;
8
+ /**
9
+ * Ширина строки
10
+ */
11
+ width?: WidthUnit | WidthUnit[];
12
+ };
13
+ export { TextElementType, TextSkeletonProps };
@@ -0,0 +1,40 @@
1
+ /// <reference types="react" />
2
+ import React from "react";
3
+ import { ReactNode } from "react";
4
+ import { TextSkeletonProps } from "./types-1b036d4b";
5
+ type SkeletonProps = {
6
+ /**
7
+ * Флаг, явно задающий состояние, при котором контент закрывается прелоадером
8
+ */
9
+ visible?: boolean;
10
+ /**
11
+ * Флаг явного включения анимации скелета
12
+ */
13
+ animate?: boolean;
14
+ /**
15
+ * Дополнительный класс
16
+ */
17
+ className?: string;
18
+ /**
19
+ * Дополнительные инлайн стили
20
+ */
21
+ style?: React.CSSProperties;
22
+ /**
23
+ * Идентификатор для систем автоматизированного тестирования
24
+ */
25
+ dataTestId?: string;
26
+ /**
27
+ * Дочерние элементы.
28
+ */
29
+ children?: ReactNode;
30
+ };
31
+ declare const Skeleton: React.FC<SkeletonProps>;
32
+ type SkeletonProps$0 = {
33
+ wrapperClassName?: string;
34
+ dataTestId?: string;
35
+ };
36
+ declare function useSkeleton(showSkeleton?: boolean, skeletonProps?: TextSkeletonProps): {
37
+ renderSkeleton: (props: SkeletonProps$0) => React.JSX.Element | null;
38
+ textRef: React.RefObject<HTMLElement>;
39
+ };
40
+ export { SkeletonProps, Skeleton, useSkeleton };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-date-range-input",
3
- "version": "3.0.1",
3
+ "version": "3.0.3",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -35,9 +35,9 @@
35
35
  "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
36
36
  },
37
37
  "dependencies": {
38
- "@alfalab/core-components-input": "^12.0.1",
39
- "@alfalab/core-components-icon-button": "^6.2.1",
40
- "@alfalab/core-components-calendar": "^7.0.1",
38
+ "@alfalab/core-components-input": "^12.0.2",
39
+ "@alfalab/core-components-icon-button": "^6.2.2",
40
+ "@alfalab/core-components-calendar": "^7.0.3",
41
41
  "@alfalab/core-components-popover": "^6.1.0",
42
42
  "@alfalab/hooks": "^1.13.0",
43
43
  "@alfalab/icons-glyph": "^2.108.0",
@@ -414,9 +414,7 @@ export const DateRangeInput = React.forwardRef<HTMLInputElement, DateRangeInputP
414
414
  };
415
415
 
416
416
  const handleCalendarChange = (date?: number) => {
417
- if (date) {
418
- updatePeriod(date);
419
- }
417
+ updatePeriod(date);
420
418
  };
421
419
 
422
420
  const handleCalendarWrapperMouseDown = (event: MouseEvent<HTMLDivElement>) => {
@@ -0,0 +1,13 @@
1
+ type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
2
+ type WidthUnit = number | string;
3
+ type TextSkeletonProps = {
4
+ /**
5
+ * Кол-во строк текста
6
+ */
7
+ rows?: number;
8
+ /**
9
+ * Ширина строки
10
+ */
11
+ width?: WidthUnit | WidthUnit[];
12
+ };
13
+ export { TextElementType, TextSkeletonProps };
@@ -0,0 +1,40 @@
1
+ /// <reference types="react" />
2
+ import React from "react";
3
+ import { ReactNode } from "react";
4
+ import { TextSkeletonProps } from "./types-1b036d4b";
5
+ type SkeletonProps = {
6
+ /**
7
+ * Флаг, явно задающий состояние, при котором контент закрывается прелоадером
8
+ */
9
+ visible?: boolean;
10
+ /**
11
+ * Флаг явного включения анимации скелета
12
+ */
13
+ animate?: boolean;
14
+ /**
15
+ * Дополнительный класс
16
+ */
17
+ className?: string;
18
+ /**
19
+ * Дополнительные инлайн стили
20
+ */
21
+ style?: React.CSSProperties;
22
+ /**
23
+ * Идентификатор для систем автоматизированного тестирования
24
+ */
25
+ dataTestId?: string;
26
+ /**
27
+ * Дочерние элементы.
28
+ */
29
+ children?: ReactNode;
30
+ };
31
+ declare const Skeleton: React.FC<SkeletonProps>;
32
+ type SkeletonProps$0 = {
33
+ wrapperClassName?: string;
34
+ dataTestId?: string;
35
+ };
36
+ declare function useSkeleton(showSkeleton?: boolean, skeletonProps?: TextSkeletonProps): {
37
+ renderSkeleton: (props: SkeletonProps$0) => React.JSX.Element | null;
38
+ textRef: React.RefObject<HTMLElement>;
39
+ };
40
+ export { SkeletonProps, Skeleton, useSkeleton };