@alfalab/core-components-calendar-input 5.1.2 → 5.2.2

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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,41 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [5.2.2](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-calendar-input@5.2.1...@alfalab/core-components-calendar-input@5.2.2) (2022-01-17)
7
+
8
+ **Note:** Version bump only for package @alfalab/core-components-calendar-input
9
+
10
+
11
+
12
+
13
+
14
+ ## [5.2.1](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-calendar-input@5.2.0...@alfalab/core-components-calendar-input@5.2.1) (2021-12-29)
15
+
16
+ **Note:** Version bump only for package @alfalab/core-components-calendar-input
17
+
18
+
19
+
20
+
21
+
22
+ # [5.2.0](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-calendar-input@5.1.3...@alfalab/core-components-calendar-input@5.2.0) (2021-12-21)
23
+
24
+
25
+ ### Features
26
+
27
+ * **calendar-input:** add popover z-index ([#924](https://github.com/alfa-laboratory/core-components/issues/924)) ([378286d](https://github.com/alfa-laboratory/core-components/commit/378286d746ca33aeb755617270f66310712d1c61))
28
+
29
+
30
+
31
+
32
+
33
+ ## [5.1.3](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-calendar-input@5.1.2...@alfalab/core-components-calendar-input@5.1.3) (2021-12-14)
34
+
35
+ **Note:** Version bump only for package @alfalab/core-components-calendar-input
36
+
37
+
38
+
39
+
40
+
6
41
  ## [5.1.2](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-calendar-input@5.1.1...@alfalab/core-components-calendar-input@5.1.2) (2021-12-08)
7
42
 
8
43
  **Note:** Version bump only for package @alfalab/core-components-calendar-input
@@ -88,6 +88,10 @@ type CalendarInputProps = Omit<DateInputProps, 'onChange' | 'mobileMode'> & {
88
88
  * Позиционирование поповера с календарем
89
89
  */
90
90
  popoverPosition?: PopoverProps['position'];
91
+ /**
92
+ * z-index Popover
93
+ */
94
+ zIndexPopover?: PopoverProps['zIndex'];
91
95
  /**
92
96
  * Календарь будет принимать ширину инпута
93
97
  */
@@ -177,6 +181,10 @@ declare const CalendarInput: React.ForwardRefExoticComponent<Pick<DateInputProps
177
181
  * Позиционирование поповера с календарем
178
182
  */
179
183
  popoverPosition?: "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
184
+ /**
185
+ * z-index Popover
186
+ */
187
+ zIndexPopover?: number | undefined;
180
188
  /**
181
189
  * Календарь будет принимать ширину инпута
182
190
  */
package/dist/Component.js CHANGED
@@ -55,12 +55,12 @@ function __rest(s, e) {
55
55
  return t;
56
56
  }
57
57
 
58
- var styles = {"component":"calendar-input__component_7j6g4","block":"calendar-input__block_7j6g4","calendarContainer":"calendar-input__calendarContainer_7j6g4","calendarIcon":"calendar-input__calendarIcon_7j6g4","nativeInput":"calendar-input__nativeInput_7j6g4"};
58
+ var styles = {"component":"calendar-input__component_1vyp5","block":"calendar-input__block_1vyp5","calendarContainer":"calendar-input__calendarContainer_1vyp5","calendarIcon":"calendar-input__calendarIcon_1vyp5","nativeInput":"calendar-input__nativeInput_1vyp5"};
59
59
  require('./index.css')
60
60
 
61
61
  var CalendarInput = React.forwardRef(function (_a, ref) {
62
62
  var _b;
63
- var _c = _a.block, block = _c === void 0 ? false : _c, className = _a.className, inputClassName = _a.inputClassName, popoverClassName = _a.popoverClassName, _d = _a.defaultOpen, defaultOpen = _d === void 0 ? false : _d, defaultMonth = _a.defaultMonth, _e = _a.defaultValue, defaultValue = _e === void 0 ? '' : _e, _f = _a.calendarPosition, calendarPosition = _f === void 0 ? 'popover' : _f, value = _a.value, dataTestId = _a.dataTestId, _g = _a.calendarProps, calendarProps = _g === void 0 ? {} : _g, _h = _a.minDate, minDate = _h === void 0 ? calendarProps.minDate : _h, _j = _a.maxDate, maxDate = _j === void 0 ? calendarProps.maxDate : _j, _k = _a.offDays, offDays = _k === void 0 ? calendarProps.offDays || [] : _k, preventFlip = _a.preventFlip, _l = _a.mobileMode, mobileMode = _l === void 0 ? 'popover' : _l, _m = _a.wrapperRef, wrapperRef = _m === void 0 ? null : _m, disabled = _a.disabled, onChange = _a.onChange, onInputChange = _a.onInputChange, onCalendarChange = _a.onCalendarChange, onKeyDown = _a.onKeyDown, readOnly = _a.readOnly, _o = _a.Calendar, Calendar = _o === void 0 ? coreComponentsCalendar.Calendar : _o, _p = _a.popoverPosition, popoverPosition = _p === void 0 ? 'bottom-start' : _p, useAnchorWidth = _a.useAnchorWidth, rightAddons = _a.rightAddons, restProps = __rest(_a, ["block", "className", "inputClassName", "popoverClassName", "defaultOpen", "defaultMonth", "defaultValue", "calendarPosition", "value", "dataTestId", "calendarProps", "minDate", "maxDate", "offDays", "preventFlip", "mobileMode", "wrapperRef", "disabled", "onChange", "onInputChange", "onCalendarChange", "onKeyDown", "readOnly", "Calendar", "popoverPosition", "useAnchorWidth", "rightAddons"]);
63
+ var _c = _a.block, block = _c === void 0 ? false : _c, className = _a.className, inputClassName = _a.inputClassName, popoverClassName = _a.popoverClassName, _d = _a.defaultOpen, defaultOpen = _d === void 0 ? false : _d, defaultMonth = _a.defaultMonth, _e = _a.defaultValue, defaultValue = _e === void 0 ? '' : _e, _f = _a.calendarPosition, calendarPosition = _f === void 0 ? 'popover' : _f, value = _a.value, dataTestId = _a.dataTestId, _g = _a.calendarProps, calendarProps = _g === void 0 ? {} : _g, _h = _a.minDate, minDate = _h === void 0 ? calendarProps.minDate : _h, _j = _a.maxDate, maxDate = _j === void 0 ? calendarProps.maxDate : _j, _k = _a.offDays, offDays = _k === void 0 ? calendarProps.offDays || [] : _k, preventFlip = _a.preventFlip, _l = _a.mobileMode, mobileMode = _l === void 0 ? 'popover' : _l, _m = _a.wrapperRef, wrapperRef = _m === void 0 ? null : _m, disabled = _a.disabled, onChange = _a.onChange, onInputChange = _a.onInputChange, onCalendarChange = _a.onCalendarChange, onKeyDown = _a.onKeyDown, readOnly = _a.readOnly, _o = _a.Calendar, Calendar = _o === void 0 ? coreComponentsCalendar.Calendar : _o, _p = _a.popoverPosition, popoverPosition = _p === void 0 ? 'bottom-start' : _p, zIndexPopover = _a.zIndexPopover, useAnchorWidth = _a.useAnchorWidth, rightAddons = _a.rightAddons, restProps = __rest(_a, ["block", "className", "inputClassName", "popoverClassName", "defaultOpen", "defaultMonth", "defaultValue", "calendarPosition", "value", "dataTestId", "calendarProps", "minDate", "maxDate", "offDays", "preventFlip", "mobileMode", "wrapperRef", "disabled", "onChange", "onInputChange", "onCalendarChange", "onKeyDown", "readOnly", "Calendar", "popoverPosition", "zIndexPopover", "useAnchorWidth", "rightAddons"]);
64
64
  var uncontrolled = value === undefined;
65
65
  var shouldRenderNative = coreComponentsDateInput.SUPPORTS_INPUT_TYPE_DATE && mobileMode === 'native';
66
66
  var shouldRenderOnlyInput = mobileMode === 'input';
@@ -163,7 +163,7 @@ var CalendarInput = React.forwardRef(function (_a, ref) {
163
163
  rightAddons,
164
164
  React__default['default'].createElement(CalendarMIcon.CalendarMIcon, { className: styles.calendarIcon })), onKeyDown: handleInputKeyDown, onChange: handleInputChange, block: true })),
165
165
  shouldRenderStatic && renderCalendar(),
166
- shouldRenderPopover && (React__default['default'].createElement(coreComponentsPopover.Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles.calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip }, renderCalendar()))));
166
+ shouldRenderPopover && (React__default['default'].createElement(coreComponentsPopover.Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles.calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip, zIndex: zIndexPopover }, renderCalendar()))));
167
167
  });
168
168
 
169
169
  exports.CalendarInput = CalendarInput;
@@ -88,6 +88,10 @@ type CalendarInputProps = Omit<DateInputProps, 'onChange' | 'mobileMode'> & {
88
88
  * Позиционирование поповера с календарем
89
89
  */
90
90
  popoverPosition?: PopoverProps['position'];
91
+ /**
92
+ * z-index Popover
93
+ */
94
+ zIndexPopover?: PopoverProps['zIndex'];
91
95
  /**
92
96
  * Календарь будет принимать ширину инпута
93
97
  */
@@ -177,6 +181,10 @@ declare const CalendarInput: React.ForwardRefExoticComponent<Pick<DateInputProps
177
181
  * Позиционирование поповера с календарем
178
182
  */
179
183
  popoverPosition?: "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
184
+ /**
185
+ * z-index Popover
186
+ */
187
+ zIndexPopover?: number | undefined;
180
188
  /**
181
189
  * Календарь будет принимать ширину инпута
182
190
  */
@@ -59,7 +59,7 @@ function __rest(s, e) {
59
59
 
60
60
  var CalendarInput = React.forwardRef(function (_a, ref) {
61
61
  var _b;
62
- var _c = _a.block, block = _c === void 0 ? false : _c, className = _a.className, inputClassName = _a.inputClassName, popoverClassName = _a.popoverClassName, _d = _a.defaultOpen, defaultOpen = _d === void 0 ? false : _d, defaultMonth = _a.defaultMonth, _e = _a.defaultValue, defaultValue = _e === void 0 ? '' : _e, _f = _a.calendarPosition, calendarPosition = _f === void 0 ? 'popover' : _f, value = _a.value, dataTestId = _a.dataTestId, _g = _a.calendarProps, calendarProps = _g === void 0 ? {} : _g, _h = _a.minDate, minDate = _h === void 0 ? calendarProps.minDate : _h, _j = _a.maxDate, maxDate = _j === void 0 ? calendarProps.maxDate : _j, _k = _a.offDays, offDays = _k === void 0 ? calendarProps.offDays || [] : _k, preventFlip = _a.preventFlip, _l = _a.mobileMode, mobileMode = _l === void 0 ? 'popover' : _l, _m = _a.wrapperRef, wrapperRef = _m === void 0 ? null : _m, disabled = _a.disabled, onChange = _a.onChange, onInputChange = _a.onInputChange, onCalendarChange = _a.onCalendarChange, onKeyDown = _a.onKeyDown, readOnly = _a.readOnly, _o = _a.Calendar, Calendar = _o === void 0 ? coreComponentsCalendar.Calendar : _o, _p = _a.popoverPosition, popoverPosition = _p === void 0 ? 'bottom-start' : _p, useAnchorWidth = _a.useAnchorWidth, rightAddons = _a.rightAddons, restProps = __rest(_a, ["block", "className", "inputClassName", "popoverClassName", "defaultOpen", "defaultMonth", "defaultValue", "calendarPosition", "value", "dataTestId", "calendarProps", "minDate", "maxDate", "offDays", "preventFlip", "mobileMode", "wrapperRef", "disabled", "onChange", "onInputChange", "onCalendarChange", "onKeyDown", "readOnly", "Calendar", "popoverPosition", "useAnchorWidth", "rightAddons"]);
62
+ var _c = _a.block, block = _c === void 0 ? false : _c, className = _a.className, inputClassName = _a.inputClassName, popoverClassName = _a.popoverClassName, _d = _a.defaultOpen, defaultOpen = _d === void 0 ? false : _d, defaultMonth = _a.defaultMonth, _e = _a.defaultValue, defaultValue = _e === void 0 ? '' : _e, _f = _a.calendarPosition, calendarPosition = _f === void 0 ? 'popover' : _f, value = _a.value, dataTestId = _a.dataTestId, _g = _a.calendarProps, calendarProps = _g === void 0 ? {} : _g, _h = _a.minDate, minDate = _h === void 0 ? calendarProps.minDate : _h, _j = _a.maxDate, maxDate = _j === void 0 ? calendarProps.maxDate : _j, _k = _a.offDays, offDays = _k === void 0 ? calendarProps.offDays || [] : _k, preventFlip = _a.preventFlip, _l = _a.mobileMode, mobileMode = _l === void 0 ? 'popover' : _l, _m = _a.wrapperRef, wrapperRef = _m === void 0 ? null : _m, disabled = _a.disabled, onChange = _a.onChange, onInputChange = _a.onInputChange, onCalendarChange = _a.onCalendarChange, onKeyDown = _a.onKeyDown, readOnly = _a.readOnly, _o = _a.Calendar, Calendar = _o === void 0 ? coreComponentsCalendar.Calendar : _o, _p = _a.popoverPosition, popoverPosition = _p === void 0 ? 'bottom-start' : _p, zIndexPopover = _a.zIndexPopover, useAnchorWidth = _a.useAnchorWidth, rightAddons = _a.rightAddons, restProps = __rest(_a, ["block", "className", "inputClassName", "popoverClassName", "defaultOpen", "defaultMonth", "defaultValue", "calendarPosition", "value", "dataTestId", "calendarProps", "minDate", "maxDate", "offDays", "preventFlip", "mobileMode", "wrapperRef", "disabled", "onChange", "onInputChange", "onCalendarChange", "onKeyDown", "readOnly", "Calendar", "popoverPosition", "zIndexPopover", "useAnchorWidth", "rightAddons"]);
63
63
  var uncontrolled = value === undefined;
64
64
  var shouldRenderNative = coreComponentsDateInput.SUPPORTS_INPUT_TYPE_DATE && mobileMode === 'native';
65
65
  var shouldRenderOnlyInput = mobileMode === 'input';
@@ -162,7 +162,7 @@ var CalendarInput = React.forwardRef(function (_a, ref) {
162
162
  rightAddons,
163
163
  React__default['default'].createElement(CalendarMIcon.CalendarMIcon, { className: styles__default['default'].calendarIcon })), onKeyDown: handleInputKeyDown, onChange: handleInputChange, block: true })),
164
164
  shouldRenderStatic && renderCalendar(),
165
- shouldRenderPopover && (React__default['default'].createElement(coreComponentsPopover.Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles__default['default'].calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip }, renderCalendar()))));
165
+ shouldRenderPopover && (React__default['default'].createElement(coreComponentsPopover.Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles__default['default'].calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip, zIndex: zIndexPopover }, renderCalendar()))));
166
166
  });
167
167
 
168
168
  exports.CalendarInput = CalendarInput;
@@ -88,6 +88,10 @@ type CalendarInputProps = Omit<DateInputProps, 'onChange' | 'mobileMode'> & {
88
88
  * Позиционирование поповера с календарем
89
89
  */
90
90
  popoverPosition?: PopoverProps['position'];
91
+ /**
92
+ * z-index Popover
93
+ */
94
+ zIndexPopover?: PopoverProps['zIndex'];
91
95
  /**
92
96
  * Календарь будет принимать ширину инпута
93
97
  */
@@ -177,6 +181,10 @@ declare const CalendarInput: React.ForwardRefExoticComponent<Pick<DateInputProps
177
181
  * Позиционирование поповера с календарем
178
182
  */
179
183
  popoverPosition?: "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
184
+ /**
185
+ * z-index Popover
186
+ */
187
+ zIndexPopover?: number | undefined;
180
188
  /**
181
189
  * Календарь будет принимать ширину инпута
182
190
  */
@@ -45,12 +45,12 @@ function __rest(s, e) {
45
45
  return t;
46
46
  }
47
47
 
48
- var styles = {"component":"calendar-input__component_7j6g4","block":"calendar-input__block_7j6g4","calendarContainer":"calendar-input__calendarContainer_7j6g4","calendarIcon":"calendar-input__calendarIcon_7j6g4","nativeInput":"calendar-input__nativeInput_7j6g4"};
48
+ var styles = {"component":"calendar-input__component_1vyp5","block":"calendar-input__block_1vyp5","calendarContainer":"calendar-input__calendarContainer_1vyp5","calendarIcon":"calendar-input__calendarIcon_1vyp5","nativeInput":"calendar-input__nativeInput_1vyp5"};
49
49
  require('./index.css')
50
50
 
51
51
  var CalendarInput = forwardRef(function (_a, ref) {
52
52
  var _b;
53
- var _c = _a.block, block = _c === void 0 ? false : _c, className = _a.className, inputClassName = _a.inputClassName, popoverClassName = _a.popoverClassName, _d = _a.defaultOpen, defaultOpen = _d === void 0 ? false : _d, defaultMonth = _a.defaultMonth, _e = _a.defaultValue, defaultValue = _e === void 0 ? '' : _e, _f = _a.calendarPosition, calendarPosition = _f === void 0 ? 'popover' : _f, value = _a.value, dataTestId = _a.dataTestId, _g = _a.calendarProps, calendarProps = _g === void 0 ? {} : _g, _h = _a.minDate, minDate = _h === void 0 ? calendarProps.minDate : _h, _j = _a.maxDate, maxDate = _j === void 0 ? calendarProps.maxDate : _j, _k = _a.offDays, offDays = _k === void 0 ? calendarProps.offDays || [] : _k, preventFlip = _a.preventFlip, _l = _a.mobileMode, mobileMode = _l === void 0 ? 'popover' : _l, _m = _a.wrapperRef, wrapperRef = _m === void 0 ? null : _m, disabled = _a.disabled, onChange = _a.onChange, onInputChange = _a.onInputChange, onCalendarChange = _a.onCalendarChange, onKeyDown = _a.onKeyDown, readOnly = _a.readOnly, _o = _a.Calendar, Calendar$1 = _o === void 0 ? Calendar : _o, _p = _a.popoverPosition, popoverPosition = _p === void 0 ? 'bottom-start' : _p, useAnchorWidth = _a.useAnchorWidth, rightAddons = _a.rightAddons, restProps = __rest(_a, ["block", "className", "inputClassName", "popoverClassName", "defaultOpen", "defaultMonth", "defaultValue", "calendarPosition", "value", "dataTestId", "calendarProps", "minDate", "maxDate", "offDays", "preventFlip", "mobileMode", "wrapperRef", "disabled", "onChange", "onInputChange", "onCalendarChange", "onKeyDown", "readOnly", "Calendar", "popoverPosition", "useAnchorWidth", "rightAddons"]);
53
+ var _c = _a.block, block = _c === void 0 ? false : _c, className = _a.className, inputClassName = _a.inputClassName, popoverClassName = _a.popoverClassName, _d = _a.defaultOpen, defaultOpen = _d === void 0 ? false : _d, defaultMonth = _a.defaultMonth, _e = _a.defaultValue, defaultValue = _e === void 0 ? '' : _e, _f = _a.calendarPosition, calendarPosition = _f === void 0 ? 'popover' : _f, value = _a.value, dataTestId = _a.dataTestId, _g = _a.calendarProps, calendarProps = _g === void 0 ? {} : _g, _h = _a.minDate, minDate = _h === void 0 ? calendarProps.minDate : _h, _j = _a.maxDate, maxDate = _j === void 0 ? calendarProps.maxDate : _j, _k = _a.offDays, offDays = _k === void 0 ? calendarProps.offDays || [] : _k, preventFlip = _a.preventFlip, _l = _a.mobileMode, mobileMode = _l === void 0 ? 'popover' : _l, _m = _a.wrapperRef, wrapperRef = _m === void 0 ? null : _m, disabled = _a.disabled, onChange = _a.onChange, onInputChange = _a.onInputChange, onCalendarChange = _a.onCalendarChange, onKeyDown = _a.onKeyDown, readOnly = _a.readOnly, _o = _a.Calendar, Calendar$1 = _o === void 0 ? Calendar : _o, _p = _a.popoverPosition, popoverPosition = _p === void 0 ? 'bottom-start' : _p, zIndexPopover = _a.zIndexPopover, useAnchorWidth = _a.useAnchorWidth, rightAddons = _a.rightAddons, restProps = __rest(_a, ["block", "className", "inputClassName", "popoverClassName", "defaultOpen", "defaultMonth", "defaultValue", "calendarPosition", "value", "dataTestId", "calendarProps", "minDate", "maxDate", "offDays", "preventFlip", "mobileMode", "wrapperRef", "disabled", "onChange", "onInputChange", "onCalendarChange", "onKeyDown", "readOnly", "Calendar", "popoverPosition", "zIndexPopover", "useAnchorWidth", "rightAddons"]);
54
54
  var uncontrolled = value === undefined;
55
55
  var shouldRenderNative = SUPPORTS_INPUT_TYPE_DATE && mobileMode === 'native';
56
56
  var shouldRenderOnlyInput = mobileMode === 'input';
@@ -153,7 +153,7 @@ var CalendarInput = forwardRef(function (_a, ref) {
153
153
  rightAddons,
154
154
  React.createElement(CalendarMIcon, { className: styles.calendarIcon })), onKeyDown: handleInputKeyDown, onChange: handleInputChange, block: true })),
155
155
  shouldRenderStatic && renderCalendar(),
156
- shouldRenderPopover && (React.createElement(Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles.calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip }, renderCalendar()))));
156
+ shouldRenderPopover && (React.createElement(Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles.calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip, zIndex: zIndexPopover }, renderCalendar()))));
157
157
  });
158
158
 
159
159
  export { CalendarInput };
@@ -1,4 +1,4 @@
1
- /* hash: e3y9o */
1
+ /* hash: 14y6c */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-graphic-primary: #0b1f35;
@@ -43,15 +43,15 @@
43
43
  --calendar-input-popover-border-color: var(--color-light-border-primary);
44
44
  --calendar-input-popover-border-radius: var(--border-radius-m);
45
45
  }
46
- .calendar-input__component_7j6g4 {
46
+ .calendar-input__component_1vyp5 {
47
47
  display: inline-block;
48
48
  outline: none;
49
49
  position: relative;
50
50
  }
51
- .calendar-input__block_7j6g4 {
51
+ .calendar-input__block_1vyp5 {
52
52
  width: 100%;
53
53
  }
54
- .calendar-input__calendarContainer_7j6g4 {
54
+ .calendar-input__calendarContainer_1vyp5 {
55
55
  display: inline-block;
56
56
  box-sizing: border-box;
57
57
  box-shadow: var(--shadow-s);
@@ -59,21 +59,21 @@
59
59
  border-radius: var(--calendar-input-popover-border-radius)
60
60
  }
61
61
  @media (max-width: 374px) {
62
- .calendar-input__calendarContainer_7j6g4 {
62
+ .calendar-input__calendarContainer_1vyp5 {
63
63
  width: 100%;
64
64
  min-width: 288px
65
65
  }
66
66
  }
67
- .calendar-input__calendarIcon_7j6g4 {
67
+ .calendar-input__calendarIcon_1vyp5 {
68
68
  width: 24px;
69
69
  height: 24px;
70
70
  display: block;
71
71
  color: var(--calendar-input-icon-color)
72
72
  }
73
- .calendar-input__calendarIcon_7j6g4:not(:only-child) {
73
+ .calendar-input__calendarIcon_1vyp5:not(:only-child) {
74
74
  margin-right: var(--gap-2xs);
75
75
  }
76
- .calendar-input__nativeInput_7j6g4 {
76
+ .calendar-input__nativeInput_1vyp5 {
77
77
  opacity: 0;
78
78
  position: absolute;
79
79
  top: 0;
@@ -84,9 +84,9 @@
84
84
  appearance: none;
85
85
  z-index: 1
86
86
  }
87
- .calendar-input__nativeInput_7j6g4::-webkit-calendar-picker-indicator {
87
+ .calendar-input__nativeInput_1vyp5::-webkit-calendar-picker-indicator {
88
88
  display: none;
89
89
  }
90
- .calendar-input__nativeInput_7j6g4::-webkit-inner-spin-button {
90
+ .calendar-input__nativeInput_1vyp5::-webkit-inner-spin-button {
91
91
  display: none;
92
92
  }
package/dist/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: e3y9o */
1
+ /* hash: 14y6c */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-graphic-primary: #0b1f35;
@@ -43,15 +43,15 @@
43
43
  --calendar-input-popover-border-color: var(--color-light-border-primary);
44
44
  --calendar-input-popover-border-radius: var(--border-radius-m);
45
45
  }
46
- .calendar-input__component_7j6g4 {
46
+ .calendar-input__component_1vyp5 {
47
47
  display: inline-block;
48
48
  outline: none;
49
49
  position: relative;
50
50
  }
51
- .calendar-input__block_7j6g4 {
51
+ .calendar-input__block_1vyp5 {
52
52
  width: 100%;
53
53
  }
54
- .calendar-input__calendarContainer_7j6g4 {
54
+ .calendar-input__calendarContainer_1vyp5 {
55
55
  display: inline-block;
56
56
  box-sizing: border-box;
57
57
  box-shadow: var(--shadow-s);
@@ -59,21 +59,21 @@
59
59
  border-radius: var(--calendar-input-popover-border-radius)
60
60
  }
61
61
  @media (max-width: 374px) {
62
- .calendar-input__calendarContainer_7j6g4 {
62
+ .calendar-input__calendarContainer_1vyp5 {
63
63
  width: 100%;
64
64
  min-width: 288px
65
65
  }
66
66
  }
67
- .calendar-input__calendarIcon_7j6g4 {
67
+ .calendar-input__calendarIcon_1vyp5 {
68
68
  width: 24px;
69
69
  height: 24px;
70
70
  display: block;
71
71
  color: var(--calendar-input-icon-color)
72
72
  }
73
- .calendar-input__calendarIcon_7j6g4:not(:only-child) {
73
+ .calendar-input__calendarIcon_1vyp5:not(:only-child) {
74
74
  margin-right: var(--gap-2xs);
75
75
  }
76
- .calendar-input__nativeInput_7j6g4 {
76
+ .calendar-input__nativeInput_1vyp5 {
77
77
  opacity: 0;
78
78
  position: absolute;
79
79
  top: 0;
@@ -84,9 +84,9 @@
84
84
  appearance: none;
85
85
  z-index: 1
86
86
  }
87
- .calendar-input__nativeInput_7j6g4::-webkit-calendar-picker-indicator {
87
+ .calendar-input__nativeInput_1vyp5::-webkit-calendar-picker-indicator {
88
88
  display: none;
89
89
  }
90
- .calendar-input__nativeInput_7j6g4::-webkit-inner-spin-button {
90
+ .calendar-input__nativeInput_1vyp5::-webkit-inner-spin-button {
91
91
  display: none;
92
92
  }
@@ -88,6 +88,10 @@ type CalendarInputProps = Omit<DateInputProps, 'onChange' | 'mobileMode'> & {
88
88
  * Позиционирование поповера с календарем
89
89
  */
90
90
  popoverPosition?: PopoverProps['position'];
91
+ /**
92
+ * z-index Popover
93
+ */
94
+ zIndexPopover?: PopoverProps['zIndex'];
91
95
  /**
92
96
  * Календарь будет принимать ширину инпута
93
97
  */
@@ -177,6 +181,10 @@ declare const CalendarInput: React.ForwardRefExoticComponent<Pick<DateInputProps
177
181
  * Позиционирование поповера с календарем
178
182
  */
179
183
  popoverPosition?: "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | undefined;
184
+ /**
185
+ * z-index Popover
186
+ */
187
+ zIndexPopover?: number | undefined;
180
188
  /**
181
189
  * Календарь будет принимать ширину инпута
182
190
  */
@@ -6,10 +6,10 @@ import { parseDateString, isCompleteDateInput, formatDate, DateInput, SUPPORTS_I
6
6
  import { Calendar, dateInLimits } from '@alfalab/core-components-calendar/dist/modern';
7
7
  import { CalendarMIcon } from '@alfalab/icons-glyph/CalendarMIcon';
8
8
 
9
- var styles = {"component":"calendar-input__component_7j6g4","block":"calendar-input__block_7j6g4","calendarContainer":"calendar-input__calendarContainer_7j6g4","calendarIcon":"calendar-input__calendarIcon_7j6g4","nativeInput":"calendar-input__nativeInput_7j6g4"};
9
+ var styles = {"component":"calendar-input__component_1vyp5","block":"calendar-input__block_1vyp5","calendarContainer":"calendar-input__calendarContainer_1vyp5","calendarIcon":"calendar-input__calendarIcon_1vyp5","nativeInput":"calendar-input__nativeInput_1vyp5"};
10
10
  require('./index.css')
11
11
 
12
- const CalendarInput = forwardRef(({ block = false, className, inputClassName, popoverClassName, defaultOpen = false, defaultMonth, defaultValue = '', calendarPosition = 'popover', value, dataTestId, calendarProps = {}, minDate = calendarProps.minDate, maxDate = calendarProps.maxDate, offDays = calendarProps.offDays || [], preventFlip, mobileMode = 'popover', wrapperRef = null, disabled, onChange, onInputChange, onCalendarChange, onKeyDown, readOnly, Calendar: Calendar$1 = Calendar, popoverPosition = 'bottom-start', useAnchorWidth, rightAddons, ...restProps }, ref) => {
12
+ const CalendarInput = forwardRef(({ block = false, className, inputClassName, popoverClassName, defaultOpen = false, defaultMonth, defaultValue = '', calendarPosition = 'popover', value, dataTestId, calendarProps = {}, minDate = calendarProps.minDate, maxDate = calendarProps.maxDate, offDays = calendarProps.offDays || [], preventFlip, mobileMode = 'popover', wrapperRef = null, disabled, onChange, onInputChange, onCalendarChange, onKeyDown, readOnly, Calendar: Calendar$1 = Calendar, popoverPosition = 'bottom-start', zIndexPopover, useAnchorWidth, rightAddons, ...restProps }, ref) => {
13
13
  const uncontrolled = value === undefined;
14
14
  const shouldRenderNative = SUPPORTS_INPUT_TYPE_DATE && mobileMode === 'native';
15
15
  const shouldRenderOnlyInput = mobileMode === 'input';
@@ -110,7 +110,7 @@ const CalendarInput = forwardRef(({ block = false, className, inputClassName, po
110
110
  rightAddons,
111
111
  React.createElement(CalendarMIcon, { className: styles.calendarIcon })), onKeyDown: handleInputKeyDown, onChange: handleInputChange, block: true })),
112
112
  shouldRenderStatic && renderCalendar(),
113
- shouldRenderPopover && (React.createElement(Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles.calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip }, renderCalendar()))));
113
+ shouldRenderPopover && (React.createElement(Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputWrapperRef.current, popperClassName: styles.calendarContainer, className: popoverClassName, position: popoverPosition, offset: [0, 8], withTransition: false, preventFlip: preventFlip, zIndex: zIndexPopover }, renderCalendar()))));
114
114
  });
115
115
 
116
116
  export { CalendarInput };
@@ -1,4 +1,4 @@
1
- /* hash: e3y9o */
1
+ /* hash: 14y6c */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-graphic-primary: #0b1f35;
@@ -43,15 +43,15 @@
43
43
  --calendar-input-popover-border-color: var(--color-light-border-primary);
44
44
  --calendar-input-popover-border-radius: var(--border-radius-m);
45
45
  }
46
- .calendar-input__component_7j6g4 {
46
+ .calendar-input__component_1vyp5 {
47
47
  display: inline-block;
48
48
  outline: none;
49
49
  position: relative;
50
50
  }
51
- .calendar-input__block_7j6g4 {
51
+ .calendar-input__block_1vyp5 {
52
52
  width: 100%;
53
53
  }
54
- .calendar-input__calendarContainer_7j6g4 {
54
+ .calendar-input__calendarContainer_1vyp5 {
55
55
  display: inline-block;
56
56
  box-sizing: border-box;
57
57
  box-shadow: var(--shadow-s);
@@ -59,21 +59,21 @@
59
59
  border-radius: var(--calendar-input-popover-border-radius)
60
60
  }
61
61
  @media (max-width: 374px) {
62
- .calendar-input__calendarContainer_7j6g4 {
62
+ .calendar-input__calendarContainer_1vyp5 {
63
63
  width: 100%;
64
64
  min-width: 288px
65
65
  }
66
66
  }
67
- .calendar-input__calendarIcon_7j6g4 {
67
+ .calendar-input__calendarIcon_1vyp5 {
68
68
  width: 24px;
69
69
  height: 24px;
70
70
  display: block;
71
71
  color: var(--calendar-input-icon-color)
72
72
  }
73
- .calendar-input__calendarIcon_7j6g4:not(:only-child) {
73
+ .calendar-input__calendarIcon_1vyp5:not(:only-child) {
74
74
  margin-right: var(--gap-2xs);
75
75
  }
76
- .calendar-input__nativeInput_7j6g4 {
76
+ .calendar-input__nativeInput_1vyp5 {
77
77
  opacity: 0;
78
78
  position: absolute;
79
79
  top: 0;
@@ -84,9 +84,9 @@
84
84
  appearance: none;
85
85
  z-index: 1
86
86
  }
87
- .calendar-input__nativeInput_7j6g4::-webkit-calendar-picker-indicator {
87
+ .calendar-input__nativeInput_1vyp5::-webkit-calendar-picker-indicator {
88
88
  display: none;
89
89
  }
90
- .calendar-input__nativeInput_7j6g4::-webkit-inner-spin-button {
90
+ .calendar-input__nativeInput_1vyp5::-webkit-inner-spin-button {
91
91
  display: none;
92
92
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-calendar-input",
3
- "version": "5.1.2",
3
+ "version": "5.2.2",
4
4
  "description": "Calendar input component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -19,12 +19,12 @@
19
19
  "react-dom": "^16.9.0 || ^17.0.1"
20
20
  },
21
21
  "dependencies": {
22
- "@alfalab/core-components-calendar": "^4.0.0",
23
- "@alfalab/core-components-date-input": "^1.2.7",
22
+ "@alfalab/core-components-calendar": "^4.1.0",
23
+ "@alfalab/core-components-date-input": "^1.2.9",
24
24
  "@alfalab/core-components-popover": "^5.6.0",
25
25
  "classnames": "^2.2.6",
26
26
  "date-fns": "^2.16.1",
27
27
  "react-merge-refs": "^1.1.0"
28
28
  },
29
- "gitHead": "4b32bf362777c910cd896057689e6035b3c4ad2e"
29
+ "gitHead": "d35b2d43cbc90ecb7665c682a2de13733bc03eb0"
30
30
  }