intelicoreact 0.0.65 → 0.0.73

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 (86) hide show
  1. package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.js +6 -2
  2. package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.scss +91 -60
  3. package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.stories.js +2 -1
  4. package/dist/Atomic/FormElements/Dropdown/Dropdown.js +48 -17
  5. package/dist/Atomic/FormElements/Dropdown/Dropdown.scss +21 -3
  6. package/dist/Atomic/FormElements/Dropdown/Dropdown.stories.js +22 -6
  7. package/dist/Atomic/FormElements/Input/Input.js +15 -4
  8. package/dist/Atomic/FormElements/Input/Input.stories.js +7 -1
  9. package/dist/Atomic/FormElements/InputDateRange/InputDateRange.js +24 -43
  10. package/dist/Atomic/FormElements/InputDateRange/InputDateRange.scss +98 -73
  11. package/dist/Atomic/FormElements/InputDateRange/InputDateRange.stories.js +3 -156
  12. package/dist/Atomic/FormElements/InputDateRange/components/Datepicker.js +11 -9
  13. package/dist/Atomic/FormElements/InputDateRange/components/SelectItem.js +3 -3
  14. package/dist/Atomic/FormElements/InputDateRange/dependencies.js +7 -7
  15. package/dist/Atomic/FormElements/Table/Table.scss +1 -1
  16. package/dist/Atomic/FormElements/Textarea/Textarea.scss +1 -1
  17. package/dist/Atomic/MainMenu/MainMenu.scss +2 -2
  18. package/dist/Atomic/UI/Accordion/Accordion.scss +2 -2
  19. package/dist/Atomic/UI/Arrow/Arrow.js +7 -8
  20. package/dist/Atomic/UI/Calendar/Calendar.js +3 -2
  21. package/dist/Atomic/UI/Calendar/Calendar.stories.js +3 -2
  22. package/dist/Atomic/UI/Status/Status.scss +1 -1
  23. package/dist/Molecular/Datepicker/Datepicker.js +451 -0
  24. package/dist/Molecular/Datepicker/Datepicker.scss +8 -0
  25. package/dist/Molecular/Datepicker/Datepicker.stories.js +44 -0
  26. package/dist/Molecular/Datepicker/components/Calendar.js +156 -0
  27. package/dist/scss/_vars.scss +3 -1
  28. package/dist/scss/main.scss +1 -1
  29. package/package.json +6 -4
  30. package/src/Atomic/FormElements/CheckboxInput/CheckboxInput.js +12 -2
  31. package/src/Atomic/FormElements/CheckboxInput/CheckboxInput.scss +91 -60
  32. package/src/Atomic/FormElements/CheckboxInput/CheckboxInput.stories.js +4 -3
  33. package/src/Atomic/FormElements/Dropdown/Dropdown.js +53 -19
  34. package/src/Atomic/FormElements/Dropdown/Dropdown.scss +21 -3
  35. package/src/Atomic/FormElements/Dropdown/Dropdown.stories.js +28 -15
  36. package/src/Atomic/FormElements/Input/Input.js +4 -0
  37. package/src/Atomic/FormElements/Input/Input.stories.js +7 -1
  38. package/src/Atomic/FormElements/InputDateRange/InputDateRange.js +191 -213
  39. package/src/Atomic/FormElements/InputDateRange/InputDateRange.scss +98 -73
  40. package/src/Atomic/FormElements/InputDateRange/InputDateRange.stories.js +35 -123
  41. package/src/Atomic/FormElements/InputDateRange/components/Datepicker.js +10 -7
  42. package/src/Atomic/FormElements/InputDateRange/components/OpenedPart.js +2 -2
  43. package/src/Atomic/FormElements/InputDateRange/components/SelectItem.js +1 -1
  44. package/src/Atomic/FormElements/InputDateRange/dependencies.js +6 -6
  45. package/src/Atomic/FormElements/Table/Table.scss +1 -1
  46. package/src/Atomic/FormElements/Textarea/Textarea.scss +1 -1
  47. package/src/Atomic/MainMenu/MainMenu.scss +2 -2
  48. package/src/Atomic/UI/Accordion/Accordion.scss +2 -2
  49. package/src/Atomic/UI/Arrow/Arrow.js +5 -5
  50. package/src/Atomic/UI/Calendar/Calendar.js +2 -2
  51. package/src/Atomic/UI/Calendar/Calendar.stories.js +2 -1
  52. package/src/Atomic/UI/Status/Status.scss +1 -1
  53. package/src/Molecular/Datepicker/Datepicker.js +346 -0
  54. package/src/Molecular/Datepicker/Datepicker.scss +8 -0
  55. package/src/Molecular/Datepicker/Datepicker.stories.js +27 -0
  56. package/src/Molecular/Datepicker/components/Calendar.js +118 -0
  57. package/src/scss/_vars.scss +3 -1
  58. package/src/scss/main.scss +1 -1
  59. package/dist/scss/anme/_anme-bootstrap-grid.scss +0 -748
  60. package/dist/scss/anme/_anme-elements.scss +0 -269
  61. package/dist/scss/anme/_anme-grid.scss +0 -111
  62. package/dist/scss/anme/_anme-justify.scss +0 -111
  63. package/dist/scss/anme/_anme-mixins-media.scss +0 -116
  64. package/dist/scss/anme/_anme-mixins.scss +0 -166
  65. package/dist/scss/anme/_anme-normalize.scss +0 -8
  66. package/dist/scss/anme/_anme-overall.scss +0 -34
  67. package/dist/scss/anme/_anme-padding-margins.scss +0 -419
  68. package/dist/scss/anme/_anme-table.scss +0 -81
  69. package/dist/scss/anme/_anme-theme.scss +0 -275
  70. package/dist/scss/anme/_anme-vars.scss +0 -91
  71. package/dist/scss/anme/_code-styling.scss +0 -23
  72. package/dist/scss/anme/styles.scss +0 -12
  73. package/src/scss/anme/_anme-bootstrap-grid.scss +0 -748
  74. package/src/scss/anme/_anme-elements.scss +0 -269
  75. package/src/scss/anme/_anme-grid.scss +0 -111
  76. package/src/scss/anme/_anme-justify.scss +0 -111
  77. package/src/scss/anme/_anme-mixins-media.scss +0 -116
  78. package/src/scss/anme/_anme-mixins.scss +0 -166
  79. package/src/scss/anme/_anme-normalize.scss +0 -8
  80. package/src/scss/anme/_anme-overall.scss +0 -34
  81. package/src/scss/anme/_anme-padding-margins.scss +0 -419
  82. package/src/scss/anme/_anme-table.scss +0 -81
  83. package/src/scss/anme/_anme-theme.scss +0 -275
  84. package/src/scss/anme/_anme-vars.scss +0 -91
  85. package/src/scss/anme/_code-styling.scss +0 -23
  86. package/src/scss/anme/styles.scss +0 -12
@@ -21,7 +21,8 @@ var CheckboxInput = function CheckboxInput(_ref) {
21
21
  value = _ref.value,
22
22
  _onChange = _ref.onChange,
23
23
  disabled = _ref.disabled,
24
- className = _ref.className;
24
+ className = _ref.className,
25
+ isStark = _ref.isStark;
25
26
  return /*#__PURE__*/_react.default.createElement("label", {
26
27
  className: (0, _classnames.default)('checkbox-input', className, (0, _defineProperty2.default)({}, "checkbox-input_disabled", disabled)),
27
28
  htmlFor: id
@@ -35,7 +36,10 @@ var CheckboxInput = function CheckboxInput(_ref) {
35
36
  return _onChange(!value, e);
36
37
  },
37
38
  checked: value,
38
- disabled: disabled
39
+ disabled: disabled,
40
+ ref: function ref(elem) {
41
+ if (elem) elem.indeterminate = isStark;
42
+ }
39
43
  }), /*#__PURE__*/_react.default.createElement("span", {
40
44
  className: "checkbox-input__mark"
41
45
  })), label && /*#__PURE__*/_react.default.createElement("div", {
@@ -1,76 +1,107 @@
1
1
  .checkbox-input {
2
- display: flex;
3
- align-items: center;
4
- cursor: pointer;
2
+ display: flex;
3
+ align-items: center;
4
+ cursor: pointer;
5
+
6
+ &_disabled {
7
+ opacity: 0.5;
8
+ pointer-events: none;
9
+ cursor: auto;
10
+ }
5
11
 
6
- &_disabled {
7
- opacity: .5;
8
- pointer-events: none;
9
- cursor: auto;
12
+ &:hover {
13
+ .checkbox-input__input {
14
+ background-color: rgba(#6b81dd, 0.2);
10
15
  }
16
+ }
17
+
18
+ &__input {
19
+ position: relative;
20
+ height: 14px;
21
+ width: 14px;
22
+ min-width: 14px;
23
+ border: 1px solid #9aa0b9;
24
+ border-radius: 2px;
25
+ overflow: hidden;
26
+ margin-right: 5px;
27
+ cursor: pointer;
28
+ transition: background-color 0.2s ease;
29
+ background-color: #ffff;
11
30
 
12
- &:hover {
13
- .checkbox-input__input {
14
- background-color: rgba(#6b81dd, .2);
15
- }
31
+ &_checked {
32
+ border-color: #6b81dd;
16
33
  }
17
34
 
18
- &__input {
19
- position: relative;
20
- height: 14px;
21
- width: 14px;
22
- min-width: 14px;
23
- border: 1px solid #9AA0B9;
24
- border-radius: 2px;
25
- overflow: hidden;
26
- margin-right: 5px;
27
- cursor: pointer;
28
- transition: background-color .2s ease;
29
- background-color: #ffff;
35
+ .checkbox-input__checkbox:checked ~ .checkbox-input__mark {
36
+ display: block;
37
+ }
38
+ }
30
39
 
31
- &_checked {
32
- border-color: #6b81dd;
33
- }
40
+ &__checkbox {
41
+ opacity: 0;
42
+ position: absolute;
43
+ height: 0;
44
+ width: 0;
45
+ }
34
46
 
35
- .checkbox-input__checkbox:checked ~ .checkbox-input__mark {
36
- display: block;
37
- }
47
+ &__mark {
48
+ display: none;
49
+ position: absolute;
50
+ width: 14px;
51
+ height: 14px;
52
+ background-color: #6b81dd;
38
53
 
54
+ &:after {
55
+ content: "";
56
+ position: absolute;
57
+ top: -2px;
58
+ bottom: 0;
59
+ left: 0;
60
+ right: 0;
61
+ margin: auto;
62
+ width: 4px;
63
+ height: 8px;
64
+ border: solid white;
65
+ border-radius: 2px;
66
+ border-width: 0 2px 2px 0;
67
+ transform: rotate(45deg);
39
68
  }
69
+ }
40
70
 
41
- &__checkbox {
42
- opacity: 0;
43
- position: absolute;
44
- height: 0;
45
- width: 0;
46
- }
71
+ &__label {
72
+ font-size: 13px;
73
+ user-select: none;
74
+ }
47
75
 
48
- &__mark {
49
- display: none;
76
+ input[type="checkbox" i] {
77
+ &:indeterminate {
78
+ display: block;
79
+ width: 100%;
80
+ height: 100%;
81
+ &:after {
82
+ content: "";
50
83
  position: absolute;
51
- width: 14px;
52
- height: 14px;
84
+ top: 0;
85
+ bottom: 0;
86
+ left: 0;
87
+ right: 0;
88
+ margin: auto;
89
+ width: 100%;
90
+ height: 100%;
53
91
  background-color: #6b81dd;
54
-
55
- &:after {
56
- content: '';
57
- position: absolute;
58
- top: -2px;
59
- bottom: 0;
60
- left: 0;
61
- right: 0;
62
- margin: auto;
63
- width: 4px;
64
- height: 8px;
65
- border: solid white;
66
- border-radius: 2px;
67
- border-width: 0 2px 2px 0;
68
- transform: rotate(45deg);
69
- }
70
- }
71
-
72
- &__label{
73
- font-size: 13px;
74
- user-select: none;
92
+ }
93
+ &:before {
94
+ content: "";
95
+ position: absolute;
96
+ top: 50%;
97
+ left: 50%;
98
+ transform: translate(-50%, -50%);
99
+ width: 65%;
100
+ border: solid white;
101
+ border-radius: 2px;
102
+ border-width: 0 2px 2px 0;
103
+ z-index: 1;
104
+ }
75
105
  }
106
+ }
76
107
  }
@@ -48,5 +48,6 @@ Checkbox.args = {
48
48
  label: 'Test label',
49
49
  value: true,
50
50
  disabled: false,
51
- forced: false
51
+ forced: false,
52
+ isStark: true
52
53
  };
@@ -21,8 +21,6 @@ var _classnames = _interopRequireDefault(require("classnames"));
21
21
 
22
22
  var _reactFeather = require("react-feather");
23
23
 
24
- var _Label = _interopRequireDefault(require("../Label/Label"));
25
-
26
24
  require("./Dropdown.scss");
27
25
 
28
26
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -36,7 +34,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
36
34
  var RC = 'dropdown';
37
35
 
38
36
  var Dropdown = function Dropdown(_ref) {
39
- var _options$find;
37
+ var _options$find, _filteredOptions$find;
40
38
 
41
39
  var options = _ref.options,
42
40
  value = _ref.value,
@@ -44,7 +42,8 @@ var Dropdown = function Dropdown(_ref) {
44
42
  onChange = _ref.onChange,
45
43
  placeholder = _ref.placeholder,
46
44
  className = _ref.className,
47
- isSearchable = _ref.isSearchable;
45
+ isSearchable = _ref.isSearchable,
46
+ entity = _ref.entity;
48
47
 
49
48
  var _useState = (0, _react.useState)(false),
50
49
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -57,6 +56,7 @@ var Dropdown = function Dropdown(_ref) {
57
56
  setSearchValue = _useState4[1];
58
57
 
59
58
  var dropdownRef = (0, _react.useRef)(null);
59
+ if (!options) return null;
60
60
  var filteredGroups = options.filter(function (item) {
61
61
  var _item$items;
62
62
 
@@ -84,6 +84,37 @@ var Dropdown = function Dropdown(_ref) {
84
84
  return item === null || item === void 0 ? void 0 : (_item$label = item.label) === null || _item$label === void 0 ? void 0 : _item$label.toLowerCase().includes((searchValue === null || searchValue === void 0 ? void 0 : searchValue.toLowerCase()) || '');
85
85
  });
86
86
  var filteredOptions = [].concat((0, _toConsumableArray2.default)(filteredItems), (0, _toConsumableArray2.default)(filteredGroups));
87
+ var modalBtnTrigger = entity && entity !== '' && typeof entity === 'string';
88
+
89
+ var onChangeHandler = function onChangeHandler(item) {
90
+ setIsOpen(false);
91
+ setSearchValue(null);
92
+ onChange(item.value);
93
+ }; // decorator
94
+
95
+
96
+ var getDepends = function getDepends(getDependsTrigger) {
97
+ var newOnChange = function newOnChange(e) {
98
+ if (e.value === 'open_modal') {
99
+ onChange('open_modal');
100
+ } else {
101
+ onChangeHandler(e);
102
+ }
103
+ }; // add pseudo option
104
+
105
+
106
+ var newOptions = [{
107
+ label: "New ".concat(entity),
108
+ value: 'open_modal',
109
+ className: 'dropdown__list-item--modal'
110
+ }].concat((0, _toConsumableArray2.default)(filteredOptions));
111
+ return {
112
+ onChange: function onChange(changeItem) {
113
+ return getDependsTrigger ? newOnChange(changeItem) : onChangeHandler(changeItem);
114
+ },
115
+ options: getDependsTrigger ? newOptions : options
116
+ };
117
+ };
87
118
 
88
119
  var handleClickOutside = function handleClickOutside(event) {
89
120
  if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
@@ -92,12 +123,6 @@ var Dropdown = function Dropdown(_ref) {
92
123
  }
93
124
  };
94
125
 
95
- var onChangeHandler = function onChangeHandler(item) {
96
- setIsOpen(false);
97
- setSearchValue(null);
98
- onChange(item.value);
99
- };
100
-
101
126
  var onSearchHandler = function onSearchHandler(name) {
102
127
  setSearchValue(name);
103
128
  };
@@ -108,11 +133,13 @@ var Dropdown = function Dropdown(_ref) {
108
133
  }) : text;
109
134
  };
110
135
 
136
+ var depend = getDepends(modalBtnTrigger);
137
+
111
138
  var getMarkupForElement = function getMarkupForElement(item) {
112
139
  return item.label.toLowerCase().includes((searchValue === null || searchValue === void 0 ? void 0 : searchValue.toLowerCase()) || '') ? /*#__PURE__*/_react.default.createElement("button", {
113
140
  key: item.value,
114
141
  onClick: function onClick() {
115
- return onChangeHandler(item);
142
+ return depend.onChange(item);
116
143
  },
117
144
  className: (0, _classnames.default)("".concat(RC, "__list-item"), (0, _defineProperty2.default)({}, "".concat(RC, "__list-item_active"), item.value === value), (0, _defineProperty2.default)({}, "".concat(RC, "__list-item_disabled"), item.disabled))
118
145
  }, /*#__PURE__*/_react.default.createElement("span", {
@@ -126,11 +153,12 @@ var Dropdown = function Dropdown(_ref) {
126
153
  };
127
154
 
128
155
  (0, _react.useEffect)(function () {
156
+ if (!value) setSearchValue(null);
129
157
  document.addEventListener('click', handleClickOutside, true);
130
158
  return function () {
131
159
  return document.removeEventListener('click', handleClickOutside, true);
132
160
  };
133
- });
161
+ }, [value]);
134
162
 
135
163
  var filteredOptionList = function filteredOptionList(filteredOption) {
136
164
  var _filteredOption$items;
@@ -164,13 +192,16 @@ var Dropdown = function Dropdown(_ref) {
164
192
  }
165
193
  }, isSearchable ? /*#__PURE__*/_react.default.createElement("input", {
166
194
  className: "".concat(RC, "__input"),
167
- value: searchValue !== null && searchValue !== void 0 ? searchValue : selectedLabel,
195
+ value: searchValue || ((_filteredOptions$find = filteredOptions.find(function (el) {
196
+ return el.value === value;
197
+ })) === null || _filteredOptions$find === void 0 ? void 0 : _filteredOptions$find.label) || '',
168
198
  onChange: function onChange(e) {
169
- return onSearchHandler(e.target.value);
199
+ onSearchHandler(e.target.value);
170
200
  },
171
201
  placeholder: placeholder,
172
- onFocus: function onFocus() {
173
- return setIsOpen(true);
202
+ onFocus: function onFocus(e) {
203
+ e.target.select();
204
+ setIsOpen(true);
174
205
  }
175
206
  }) : /*#__PURE__*/_react.default.createElement("span", {
176
207
  className: "text"
@@ -181,7 +212,7 @@ var Dropdown = function Dropdown(_ref) {
181
212
  }
182
213
  }, isOpen ? /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronUp, null) : /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronDown, null))), isOpen && filteredOptions.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
183
214
  className: "".concat(RC, "__list")
184
- }, filteredOptions.map(function (filteredOption) {
215
+ }, depend.options.map(function (filteredOption) {
185
216
  var _filteredOption$items2;
186
217
 
187
218
  return (_filteredOption$items2 = filteredOption.items) !== null && _filteredOption$items2 !== void 0 && _filteredOption$items2.length ? filteredOptionList(filteredOption) : getMarkupForElement(filteredOption);
@@ -5,6 +5,7 @@
5
5
  flex-direction: column;
6
6
  position: relative;
7
7
  width: 100%;
8
+ border-radius: 7px;
8
9
 
9
10
  &__trigger {
10
11
  background: #ffffff;
@@ -28,8 +29,8 @@
28
29
  &.error {
29
30
  border-color: $color--secondary;
30
31
  }
31
- &.placeholder .text{
32
- opacity: .7;
32
+ &.placeholder .text {
33
+ opacity: 0.7;
33
34
  }
34
35
  }
35
36
 
@@ -85,7 +86,24 @@
85
86
  width: 100%;
86
87
  height: 24px;
87
88
  white-space: nowrap;
88
-
89
+ overflow-x: hidden;
90
+
91
+ &--modal {
92
+ color: #1f7499;
93
+ font-size: 14px;
94
+ line-height: 20px;
95
+ letter-spacing: 0.2px;
96
+ position: relative;
97
+ &:after {
98
+ content: "";
99
+ position: absolute;
100
+ bottom: -2px;
101
+ height: 1px;
102
+ width: 300%;
103
+ transform: translateX(-50%);
104
+ background-color: #e8e9ec;
105
+ }
106
+ }
89
107
  &:hover,
90
108
  &_active {
91
109
  background: $color--gray--gentle;
@@ -37,10 +37,17 @@ var _default = {
37
37
  },
38
38
  onChange: {
39
39
  description: 'callback return selected value'
40
+ },
41
+ entity: {
42
+ description: 'string'
40
43
  }
41
44
  }
42
45
  };
43
46
  exports.default = _default;
47
+ var buttonStyles = {
48
+ border: 'solid 1px #000',
49
+ padding: '5px'
50
+ };
44
51
 
45
52
  var Template = function Template(args) {
46
53
  var _useState = (0, _react.useState)(''),
@@ -48,26 +55,31 @@ var Template = function Template(args) {
48
55
  value = _useState2[0],
49
56
  setValue = _useState2[1];
50
57
 
51
- return /*#__PURE__*/_react.default.createElement("div", {
58
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
52
59
  style: {
53
60
  width: 200
54
61
  }
55
62
  }, /*#__PURE__*/_react.default.createElement(_Dropdown.default, (0, _extends2.default)({}, args, {
56
63
  value: value,
57
64
  onChange: setValue
58
- })));
65
+ }))), /*#__PURE__*/_react.default.createElement("button", {
66
+ style: buttonStyles,
67
+ className: "mt10",
68
+ onClick: function onClick() {
69
+ console.log('click!');
70
+ setValue('');
71
+ }
72
+ }, "Reset"));
59
73
  };
60
74
 
61
75
  var DropdownTemplate = Template.bind({});
62
76
  exports.DropdownTemplate = DropdownTemplate;
63
77
  DropdownTemplate.args = {
78
+ entity: 'entity',
79
+ value: 'drop6',
64
80
  placeholder: 'Placeholder',
65
81
  isSearchable: true,
66
82
  options: [{
67
- label: 'Dropdown1',
68
- value: 'drop1',
69
- className: 'status status--approved'
70
- }, {
71
83
  label: 'Dropdown2',
72
84
  value: 'drop2'
73
85
  }, {
@@ -77,6 +89,10 @@ DropdownTemplate.args = {
77
89
  }, {
78
90
  label: 'Dropdown4',
79
91
  value: 'drop4'
92
+ }, {
93
+ label: 'Dropdown1',
94
+ value: 'drop1',
95
+ className: 'status status--approved'
80
96
  }, {
81
97
  label: 'Dropdown5',
82
98
  value: 'drop5'
@@ -9,10 +9,10 @@ Object.defineProperty(exports, "__esModule", {
9
9
  });
10
10
  exports.default = void 0;
11
11
 
12
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
-
14
12
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
15
13
 
14
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
+
16
16
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
17
 
18
18
  var _react = _interopRequireWildcard(require("react"));
@@ -29,6 +29,10 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
29
29
 
30
30
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
31
31
 
32
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
33
+
34
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
35
+
32
36
  var Input = function Input(_ref) {
33
37
  var onChange = _ref.onChange,
34
38
  disabled = _ref.disabled,
@@ -48,6 +52,8 @@ var Input = function Input(_ref) {
48
52
  onFocus = _ref.onFocus,
49
53
  onKeyUp = _ref.onKeyUp,
50
54
  mask = _ref.mask,
55
+ maskChar = _ref.maskChar,
56
+ formatChars = _ref.formatChars,
51
57
  error = _ref.error,
52
58
  icon = _ref.icon,
53
59
  symbolsLimit = _ref.symbolsLimit;
@@ -99,7 +105,8 @@ var Input = function Input(_ref) {
99
105
  (0, _react.useEffect)(function () {
100
106
  if (isEditing) inputRef.current.focus();
101
107
  }, [isEditing, isFocused]);
102
- var uniProps = {
108
+
109
+ var uniProps = _objectSpread(_objectSpread({
103
110
  className: "input ".concat(className),
104
111
  placeholder: placeholder,
105
112
  value: value || '',
@@ -110,7 +117,11 @@ var Input = function Input(_ref) {
110
117
  onKeyUp: handle.keyUp,
111
118
  min: min,
112
119
  max: max
113
- };
120
+ }, maskChar ? {
121
+ maskChar: maskChar
122
+ } : {}), formatChars ? {
123
+ formatChars: formatChars
124
+ } : {});
114
125
 
115
126
  function renderInput() {
116
127
  if (mask) {
@@ -111,7 +111,13 @@ InputTemplate.args = {
111
111
  min: '0',
112
112
  max: '5',
113
113
  placeholder: 'Placeholder',
114
- mask: '',
114
+ // mask: 'nnnnn0129',
115
+ // maskChar: '_',
116
+ // formatChars: {
117
+ // 'n': '[0-9]',
118
+ // 's': '[A-Za-z]',
119
+ // '*': '[A-Za-z0-9]'
120
+ // },
115
121
  icon: /*#__PURE__*/_react.default.createElement(_reactFeather.User, null),
116
122
  symbolsLimit: 225
117
123
  };
@@ -44,27 +44,18 @@ var InputDateRange = function InputDateRange(props) {
44
44
  id = props.id,
45
45
  label = props.label,
46
46
  className = props.className,
47
- buttonsTypes = props.buttonsTypes,
48
47
  value = props.value,
49
48
  _props$onChange = props.onChange,
50
49
  onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
51
50
  error = props.error,
52
51
  disabled = props.disabled,
53
52
  isHoverable = props.isHoverable,
54
- short = props.short,
55
53
  _props$isCompact = props.isCompact,
56
54
  isCompact = _props$isCompact === void 0 ? false : _props$isCompact,
57
- _props$isIntervalsHid = props.isIntervalsHidden,
58
- isIntervalsHidden = _props$isIntervalsHid === void 0 ? false : _props$isIntervalsHid,
59
- _props$isCompareHidde = props.isCompareHidden,
60
- isCompareHidden = _props$isCompareHidde === void 0 ? false : _props$isCompareHidde,
61
55
  _props$hideArrows = props.hideArrows,
62
56
  hideArrows = _props$hideArrows === void 0 ? false : _props$hideArrows,
63
57
  isOptionsRight = props.isOptionsRight,
64
- limitRange = props.limitRange,
65
- isShortWeekNames = props.isShortWeekNames,
66
- isUseAbs = props.isUseAbs,
67
- absTooltip = props.absTooltip;
58
+ isUseAbs = props.isUseAbs;
68
59
  var actualValues = (0, _dependencies.getActualDateRange)(value);
69
60
 
70
61
  var _useToggle = (0, _dependencies.useToggle)(false),
@@ -85,7 +76,6 @@ var InputDateRange = function InputDateRange(props) {
85
76
 
86
77
  var ref = !isUseAbs ? (0, _dependencies.useClickOutside)(toggleOff) : (0, _react.useRef)(null);
87
78
  var internalContainerRef = (0, _react.useRef)(null);
88
- var isEndDateNearFuture = (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).isSameOrAfter((0, _momentTimezone.default)());
89
79
 
90
80
  var handleChange = function handleChange(input) {
91
81
  var newValue = (0, _dependencies.getActualDateRange)(input);
@@ -106,6 +96,18 @@ var InputDateRange = function InputDateRange(props) {
106
96
  return formatedValue;
107
97
  };
108
98
 
99
+ var _useState5 = (0, _react.useState)(false),
100
+ _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
101
+ mountDate = _useState6[0],
102
+ setMD = _useState6[1];
103
+
104
+ (0, _react.useEffect)(function () {
105
+ if (value && !mountDate) {
106
+ setMD(true);
107
+ handleChange(_objectSpread({}, value));
108
+ }
109
+ }, [value]);
110
+
109
111
  var Range = function Range() {
110
112
  var SYMBOLS_QUANTITY_IF_TIME_ADDED = 13;
111
113
  var start = actualValues.start,
@@ -136,7 +138,8 @@ var InputDateRange = function InputDateRange(props) {
136
138
  var start = actualValues.start,
137
139
  end = actualValues.end;
138
140
  var intervalHoursCount = (0, _momentTimezone.default)(end).diff(start, 'hours');
139
- var newEnd, newStart;
141
+ var newEnd;
142
+ var newStart;
140
143
  var endHours = (0, _momentTimezone.default)(end).hours();
141
144
  var startHours = (0, _momentTimezone.default)(start).hours();
142
145
 
@@ -165,33 +168,7 @@ var InputDateRange = function InputDateRange(props) {
165
168
  var handleArrowClick = function handleArrowClick(type) {
166
169
  slideInterval(type === 'right' ? 'forward' : 'back');
167
170
  toggleOff();
168
- }; // const absData = useMemo(
169
- // () => ({
170
- // body: OpenedPart,
171
- // props: {
172
- // ...props,
173
- // key: `${actualValues.start}-${actualValues.end}-${actualValues.intervalKey}-${current}-${isCompare}`,
174
- // actualValues,
175
- // current,
176
- // setCurrent,
177
- // isCompare,
178
- // setIsCompare,
179
- // toggleOff,
180
- // onChange,
181
- // },
182
- // clickOutsideCallback: () => toggleOff(),
183
- // top: internalContainerRef.current?.getBoundingClientRect()?.bottom || 0,
184
- // left: internalContainerRef.current?.getBoundingClientRect()?.left || 0,
185
- // }),
186
- // [isToggled, value, actualValues, current, isCompare],
187
- // );
188
- // useEffect(() => {
189
- // if (current && isUseAbs && absTooltip) onChange(current, 'absTooltip/props/current');
190
- // }, [current]);
191
- // useEffect(() => {
192
- // if (isUseAbs) onChange(isToggled ? absData : null, 'absTooltip');
193
- // }, [isToggled]);
194
-
171
+ };
195
172
 
196
173
  return /*#__PURE__*/_react.default.createElement("div", {
197
174
  ref: internalContainerRef,
@@ -207,8 +184,12 @@ var InputDateRange = function InputDateRange(props) {
207
184
  }, label), /*#__PURE__*/_react.default.createElement("div", {
208
185
  className: "date-range-input__wraper",
209
186
  ref: ref,
210
- onMouseEnter: isHoverable && toggleOn,
211
- onMouseLeave: isHoverable && toggleOff
187
+ onMouseEnter: isHoverable ? toggleOn : function () {
188
+ return null;
189
+ },
190
+ onMouseLeave: isHoverable ? toggleOff : function () {
191
+ return null;
192
+ }
212
193
  }, /*#__PURE__*/_react.default.createElement("div", {
213
194
  className: (0, _classnames.default)('date-range-input__absolut-wraper', {
214
195
  'date-range-input__absolut-wraper_right-position': isOptionsRight
@@ -230,14 +211,14 @@ var InputDateRange = function InputDateRange(props) {
230
211
  type: "left",
231
212
  className: "date-range-input__arrow",
232
213
  onClick: function onClick() {
233
- return handleArrowClick("left");
214
+ return handleArrowClick('left');
234
215
  },
235
216
  disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY
236
217
  }), /*#__PURE__*/_react.default.createElement(_Arrow.default, {
237
218
  type: "right",
238
219
  className: "date-range-input__arrow",
239
220
  onClick: function onClick() {
240
- return handleArrowClick("right");
221
+ return handleArrowClick('right');
241
222
  },
242
223
  disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === 'today' || (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).add((0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).diff(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start, 'hours'), 'hours').isAfter((0, _momentTimezone.default)().add(1, 'day').startOf('day'))
243
224
  }))), isToggled && !isUseAbs && /*#__PURE__*/_react.default.createElement(_OpenedPart.default, (0, _extends2.default)({}, props, {