@alfalab/core-components-date-range-input 3.0.5 → 3.0.6

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.
@@ -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_184ip","calendarContainer":"date-range-input__calendarContainer_184ip","calendarResponsive":"date-range-input__calendarResponsive_184ip","block":"date-range-input__block_184ip","calendarIcon":"date-range-input__calendarIcon_184ip"};
26
+ var styles = {"component":"date-range-input__component_1v70p","calendarContainer":"date-range-input__calendarContainer_1v70p","calendarResponsive":"date-range-input__calendarResponsive_1v70p","block":"date-range-input__block_1v70p","calendarIcon":"date-range-input__calendarIcon_1v70p"};
27
27
  require('./index.css')
28
28
 
29
29
  var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
@@ -116,12 +116,6 @@ var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
116
116
  }
117
117
  }
118
118
  };
119
- var handleInputKeyDown = function (event) {
120
- var isCopy = (event.metaKey || event.ctrlKey) && event.key === 'c';
121
- if (disableUserInput && !isCopy && event.key !== 'Tab') {
122
- event.preventDefault();
123
- }
124
- };
125
119
  var handleBlur = function (event) {
126
120
  var _a, _b, _c;
127
121
  if (view === 'desktop') {
@@ -220,7 +214,7 @@ var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
220
214
  return (React__default.default.createElement("div", { className: cn__default.default(styles.component, className, (_b = {},
221
215
  _b[styles.block] = block,
222
216
  _b)), onFocus: inputDisabled ? undefined : handleInputWrapperFocus, onBlur: handleBlur },
223
- InputComponent ? (React__default.default.createElement(InputComponent, tslib.__assign({}, restProps, { block: block, ref: mergeRefs__default.default([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, onKeyDown: handleInputKeyDown, rightAddons: React__default.default.createElement(React__default.default.Fragment, null,
217
+ InputComponent ? (React__default.default.createElement(InputComponent, tslib.__assign({}, restProps, { block: block, ref: mergeRefs__default.default([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, disableUserInput: disableUserInput, rightAddons: React__default.default.createElement(React__default.default.Fragment, null,
224
218
  rightAddons,
225
219
  picker && (React__default.default.createElement(coreComponentsIconButton.IconButton, { className: styles.calendarIcon, ref: iconRef, onClick: inputDisabled ? undefined : handleIconButtonClick, icon: CalendarMIcon.CalendarMIcon, size: 's' }))) }))) : null,
226
220
  picker && (React__default.default.createElement(coreComponentsPopover.Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputRef.current, popperClassName: cn__default.default(styles.calendarContainer, (_c = {},
@@ -1,4 +1,4 @@
1
- /* hash: 9bgzg */
1
+ /* hash: 113ul */
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_184ip {
44
+ } .date-range-input__component_1v70p {
45
45
  display: inline-block;
46
46
  outline: none;
47
47
  position: relative;
48
- } .date-range-input__calendarContainer_184ip {
48
+ } .date-range-input__calendarContainer_1v70p {
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_184ip {
53
+ } @media (max-width: 374px) { .date-range-input__calendarContainer_1v70p {
54
54
  width: 100%;
55
55
  min-width: 288px
56
56
  }
57
- } .date-range-input__calendarResponsive_184ip {
57
+ } .date-range-input__calendarResponsive_1v70p {
58
58
  width: var(--calendar-width);
59
- } .date-range-input__block_184ip {
59
+ } .date-range-input__block_1v70p {
60
60
  width: 100%;
61
- } .date-range-input__calendarIcon_184ip {
61
+ } .date-range-input__calendarIcon_1v70p {
62
62
  margin-right: var(--gap-s-neg);
63
63
  height: 100%;
64
64
  }
@@ -115,12 +115,6 @@ var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
115
115
  }
116
116
  }
117
117
  };
118
- var handleInputKeyDown = function (event) {
119
- var isCopy = (event.metaKey || event.ctrlKey) && event.key === 'c';
120
- if (disableUserInput && !isCopy && event.key !== 'Tab') {
121
- event.preventDefault();
122
- }
123
- };
124
118
  var handleBlur = function (event) {
125
119
  var _a, _b, _c;
126
120
  if (view === 'desktop') {
@@ -219,7 +213,7 @@ var DateRangeInput = React__default.default.forwardRef(function (_a, ref) {
219
213
  return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, className, (_b = {},
220
214
  _b[styles__default.default.block] = block,
221
215
  _b)), onFocus: inputDisabled ? undefined : handleInputWrapperFocus, onBlur: handleBlur },
222
- InputComponent ? (React__default.default.createElement(InputComponent, tslib.__assign({}, restProps, { block: block, ref: mergeRefs__default.default([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, onKeyDown: handleInputKeyDown, rightAddons: React__default.default.createElement(React__default.default.Fragment, null,
216
+ InputComponent ? (React__default.default.createElement(InputComponent, tslib.__assign({}, restProps, { block: block, ref: mergeRefs__default.default([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, disableUserInput: disableUserInput, rightAddons: React__default.default.createElement(React__default.default.Fragment, null,
223
217
  rightAddons,
224
218
  picker && (React__default.default.createElement(coreComponentsIconButton.IconButton, { className: styles__default.default.calendarIcon, ref: iconRef, onClick: inputDisabled ? undefined : handleIconButtonClick, icon: CalendarMIcon.CalendarMIcon, size: 's' }))) }))) : null,
225
219
  picker && (React__default.default.createElement(coreComponentsPopover.Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputRef.current, popperClassName: cn__default.default(styles__default.default.calendarContainer, (_c = {},
@@ -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_184ip","calendarContainer":"date-range-input__calendarContainer_184ip","calendarResponsive":"date-range-input__calendarResponsive_184ip","block":"date-range-input__block_184ip","calendarIcon":"date-range-input__calendarIcon_184ip"};
15
+ var styles = {"component":"date-range-input__component_1v70p","calendarContainer":"date-range-input__calendarContainer_1v70p","calendarResponsive":"date-range-input__calendarResponsive_1v70p","block":"date-range-input__block_1v70p","calendarIcon":"date-range-input__calendarIcon_1v70p"};
16
16
  require('./index.css')
17
17
 
18
18
  var DateRangeInput = React.forwardRef(function (_a, ref) {
@@ -105,12 +105,6 @@ var DateRangeInput = React.forwardRef(function (_a, ref) {
105
105
  }
106
106
  }
107
107
  };
108
- var handleInputKeyDown = function (event) {
109
- var isCopy = (event.metaKey || event.ctrlKey) && event.key === 'c';
110
- if (disableUserInput && !isCopy && event.key !== 'Tab') {
111
- event.preventDefault();
112
- }
113
- };
114
108
  var handleBlur = function (event) {
115
109
  var _a, _b, _c;
116
110
  if (view === 'desktop') {
@@ -209,7 +203,7 @@ var DateRangeInput = React.forwardRef(function (_a, ref) {
209
203
  return (React.createElement("div", { className: cn(styles.component, className, (_b = {},
210
204
  _b[styles.block] = block,
211
205
  _b)), onFocus: inputDisabled ? undefined : handleInputWrapperFocus, onBlur: handleBlur },
212
- InputComponent ? (React.createElement(InputComponent, __assign({}, restProps, { block: block, ref: mergeRefs([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, onKeyDown: handleInputKeyDown, rightAddons: React.createElement(React.Fragment, null,
206
+ InputComponent ? (React.createElement(InputComponent, __assign({}, restProps, { block: block, ref: mergeRefs([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, disableUserInput: disableUserInput, rightAddons: React.createElement(React.Fragment, null,
213
207
  rightAddons,
214
208
  picker && (React.createElement(IconButton, { className: styles.calendarIcon, ref: iconRef, onClick: inputDisabled ? undefined : handleIconButtonClick, icon: CalendarMIcon, size: 's' }))) }))) : null,
215
209
  picker && (React.createElement(Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputRef.current, popperClassName: cn(styles.calendarContainer, (_c = {},
@@ -1,4 +1,4 @@
1
- /* hash: 9bgzg */
1
+ /* hash: 113ul */
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_184ip {
44
+ } .date-range-input__component_1v70p {
45
45
  display: inline-block;
46
46
  outline: none;
47
47
  position: relative;
48
- } .date-range-input__calendarContainer_184ip {
48
+ } .date-range-input__calendarContainer_1v70p {
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_184ip {
53
+ } @media (max-width: 374px) { .date-range-input__calendarContainer_1v70p {
54
54
  width: 100%;
55
55
  min-width: 288px
56
56
  }
57
- } .date-range-input__calendarResponsive_184ip {
57
+ } .date-range-input__calendarResponsive_1v70p {
58
58
  width: var(--calendar-width);
59
- } .date-range-input__block_184ip {
59
+ } .date-range-input__block_1v70p {
60
60
  width: 100%;
61
- } .date-range-input__calendarIcon_184ip {
61
+ } .date-range-input__calendarIcon_1v70p {
62
62
  margin-right: var(--gap-s-neg);
63
63
  height: 100%;
64
64
  }
@@ -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_184ip","calendarContainer":"date-range-input__calendarContainer_184ip","calendarResponsive":"date-range-input__calendarResponsive_184ip","block":"date-range-input__block_184ip","calendarIcon":"date-range-input__calendarIcon_184ip"};
14
+ const styles = {"component":"date-range-input__component_1v70p","calendarContainer":"date-range-input__calendarContainer_1v70p","calendarResponsive":"date-range-input__calendarResponsive_1v70p","block":"date-range-input__block_1v70p","calendarIcon":"date-range-input__calendarIcon_1v70p"};
15
15
  require('./index.css')
16
16
 
17
17
  /* eslint-disable no-useless-escape, jsx-a11y/click-events-have-key-events */
@@ -101,12 +101,6 @@ const DateRangeInput = React.forwardRef(({ className, inputClassName, popoverCla
101
101
  }
102
102
  }
103
103
  };
104
- const handleInputKeyDown = (event) => {
105
- const isCopy = (event.metaKey || event.ctrlKey) && event.key === 'c';
106
- if (disableUserInput && !isCopy && event.key !== 'Tab') {
107
- event.preventDefault();
108
- }
109
- };
110
104
  const handleBlur = (event) => {
111
105
  if (view === 'desktop') {
112
106
  const target = (event.relatedTarget || document.activeElement);
@@ -203,7 +197,7 @@ const DateRangeInput = React.forwardRef(({ className, inputClassName, popoverCla
203
197
  return (React.createElement("div", { className: cn(styles.component, className, {
204
198
  [styles.block]: block,
205
199
  }), onFocus: inputDisabled ? undefined : handleInputWrapperFocus, onBlur: handleBlur },
206
- InputComponent ? (React.createElement(InputComponent, { ...restProps, block: block, ref: mergeRefs([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, onKeyDown: handleInputKeyDown, rightAddons: React.createElement(React.Fragment, null,
200
+ InputComponent ? (React.createElement(InputComponent, { ...restProps, block: block, ref: mergeRefs([ref, inputRef]), value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, className: inputClassName, onClear: handleClear, disableUserInput: disableUserInput, rightAddons: React.createElement(React.Fragment, null,
207
201
  rightAddons,
208
202
  picker && (React.createElement(IconButton, { className: styles.calendarIcon, ref: iconRef, onClick: inputDisabled ? undefined : handleIconButtonClick, icon: CalendarMIcon, size: 's' }))) })) : null,
209
203
  picker && (React.createElement(Popover, { open: open, useAnchorWidth: useAnchorWidth, anchorElement: inputRef.current, popperClassName: cn(styles.calendarContainer, {
@@ -1,4 +1,4 @@
1
- /* hash: 9bgzg */
1
+ /* hash: 113ul */
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_184ip {
44
+ } .date-range-input__component_1v70p {
45
45
  display: inline-block;
46
46
  outline: none;
47
47
  position: relative;
48
- } .date-range-input__calendarContainer_184ip {
48
+ } .date-range-input__calendarContainer_1v70p {
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_184ip {
53
+ } @media (max-width: 374px) { .date-range-input__calendarContainer_1v70p {
54
54
  width: 100%;
55
55
  min-width: 288px
56
56
  }
57
- } .date-range-input__calendarResponsive_184ip {
57
+ } .date-range-input__calendarResponsive_1v70p {
58
58
  width: var(--calendar-width);
59
- } .date-range-input__block_184ip {
59
+ } .date-range-input__block_1v70p {
60
60
  width: 100%;
61
- } .date-range-input__calendarIcon_184ip {
61
+ } .date-range-input__calendarIcon_1v70p {
62
62
  margin-right: var(--gap-s-neg);
63
63
  height: 100%;
64
64
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-date-range-input",
3
- "version": "3.0.5",
3
+ "version": "3.0.6",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -35,7 +35,7 @@
35
35
  "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
36
36
  },
37
37
  "dependencies": {
38
- "@alfalab/core-components-input": "^12.1.0",
38
+ "@alfalab/core-components-input": "^12.1.1",
39
39
  "@alfalab/core-components-icon-button": "^6.2.3",
40
40
  "@alfalab/core-components-calendar": "^7.0.4",
41
41
  "@alfalab/core-components-popover": "^6.1.0",
@@ -3,7 +3,6 @@ import React, {
3
3
  ChangeEvent,
4
4
  ElementType,
5
5
  FocusEvent,
6
- KeyboardEvent,
7
6
  MouseEvent,
8
7
  useEffect,
9
8
  useRef,
@@ -316,14 +315,6 @@ export const DateRangeInput = React.forwardRef<HTMLInputElement, DateRangeInputP
316
315
  }
317
316
  };
318
317
 
319
- const handleInputKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {
320
- const isCopy = (event.metaKey || event.ctrlKey) && event.key === 'c';
321
-
322
- if (disableUserInput && !isCopy && event.key !== 'Tab') {
323
- event.preventDefault();
324
- }
325
- };
326
-
327
318
  const handleBlur = (event: FocusEvent<HTMLDivElement>) => {
328
319
  if (view === 'desktop') {
329
320
  const target = (event.relatedTarget || document.activeElement) as HTMLElement;
@@ -476,7 +467,7 @@ export const DateRangeInput = React.forwardRef<HTMLInputElement, DateRangeInputP
476
467
  readOnly={readOnly}
477
468
  className={inputClassName}
478
469
  onClear={handleClear}
479
- onKeyDown={handleInputKeyDown}
470
+ disableUserInput={disableUserInput}
480
471
  rightAddons={
481
472
  <React.Fragment>
482
473
  {rightAddons}