@synerise/ds-factors 0.27.2 → 0.27.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.
- package/CHANGELOG.md +11 -0
- package/dist/FactorTypeSelector/FactorTypeSelector.js +6 -10
- package/dist/FactorValue/Date/Date.d.ts +1 -1
- package/dist/FactorValue/Date/Date.js +16 -23
- package/dist/FactorValue/DateRange/DateRange.js +8 -10
- package/dist/FactorValue/DynamicKey/DynamicKey.js +16 -30
- package/dist/FactorValue/DynamicKey/DynamicKey.style.js +2 -1
- package/dist/FactorValue/FactorValue.js +24 -26
- package/dist/FactorValue/FactorValue.style.js +4 -8
- package/dist/FactorValue/Formula/Formula.js +10 -15
- package/dist/FactorValue/Formula/Formula.styles.js +2 -1
- package/dist/FactorValue/Formula/FormulaModal.js +7 -11
- package/dist/FactorValue/Number/NumberInput.js +9 -15
- package/dist/FactorValue/Parameter/Parameter.constants.js +0 -1
- package/dist/FactorValue/Parameter/Parameter.js +35 -56
- package/dist/FactorValue/Parameter/ParameterDropdown.js +32 -68
- package/dist/FactorValue/Parameter/ParameterDropdownItem.js +9 -16
- package/dist/FactorValue/Parameter/useGroups.js +0 -12
- package/dist/FactorValue/Parameter/utils.js +0 -4
- package/dist/FactorValue/Text/Text.js +20 -33
- package/dist/FactorValue/Text/Text.styles.js +2 -1
- package/dist/FactorValue/Text/TextModal.js +6 -10
- package/dist/Factors.js +32 -34
- package/package.json +3 -3
|
@@ -1,19 +1,11 @@
|
|
|
1
1
|
var _excluded = ["buttonIcon", "buttonLabel", "selectedButtonColored", "dropdownDimensionsConfig"];
|
|
2
|
-
|
|
3
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
4
|
-
|
|
5
3
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6
|
-
|
|
7
4
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
8
|
-
|
|
9
5
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
10
|
-
|
|
11
6
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
12
|
-
|
|
13
7
|
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
14
|
-
|
|
15
8
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
16
|
-
|
|
17
9
|
import React, { useCallback, useMemo, useState, useEffect } from 'react';
|
|
18
10
|
import Dropdown from '@synerise/ds-dropdown';
|
|
19
11
|
import Button from '@synerise/ds-button';
|
|
@@ -24,60 +16,52 @@ import InformationCard from '@synerise/ds-information-card';
|
|
|
24
16
|
import { Value } from './Parameter.style';
|
|
25
17
|
import ParameterDropdown from './ParameterDropdown';
|
|
26
18
|
import { DROPDOWN_HEIGHT, DROPDOWN_HEIGHT_BELOW_THRESHOLD, DROPDOWN_HEIGHT_THRESHOLD } from './Parameter.constants';
|
|
27
|
-
|
|
28
19
|
var ParameterInput = function ParameterInput(_ref) {
|
|
29
20
|
var value = _ref.value,
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
21
|
+
onChange = _ref.onChange,
|
|
22
|
+
onParamsClick = _ref.onParamsClick,
|
|
23
|
+
parameters = _ref.parameters,
|
|
24
|
+
texts = _ref.texts,
|
|
25
|
+
opened = _ref.opened,
|
|
26
|
+
preventAutoloadData = _ref.preventAutoloadData,
|
|
27
|
+
getPopupContainerOverride = _ref.getPopupContainerOverride,
|
|
28
|
+
onActivate = _ref.onActivate,
|
|
29
|
+
onDeactivate = _ref.onDeactivate,
|
|
30
|
+
_ref$readOnly = _ref.readOnly,
|
|
31
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
32
|
+
error = _ref.error,
|
|
33
|
+
loading = _ref.loading,
|
|
34
|
+
getMenuEntryProps = _ref.getMenuEntryProps;
|
|
45
35
|
// @ts-ignore
|
|
46
36
|
var buttonIcon = parameters.buttonIcon,
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
37
|
+
buttonLabel = parameters.buttonLabel,
|
|
38
|
+
selectedButtonColored = parameters.selectedButtonColored,
|
|
39
|
+
dropdownDimensionsConfig = parameters.dropdownDimensionsConfig,
|
|
40
|
+
restParameters = _objectWithoutPropertiesLoose(parameters, _excluded);
|
|
52
41
|
var dimensionsConfig = _objectSpread({
|
|
53
42
|
defaultHeight: DROPDOWN_HEIGHT,
|
|
54
43
|
lowerHeight: DROPDOWN_HEIGHT_BELOW_THRESHOLD,
|
|
55
44
|
threshold: DROPDOWN_HEIGHT_THRESHOLD
|
|
56
45
|
}, dropdownDimensionsConfig);
|
|
57
|
-
|
|
58
46
|
var _useState = useState(false),
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
47
|
+
dropdownVisible = _useState[0],
|
|
48
|
+
setDropdownVisible = _useState[1];
|
|
62
49
|
var _useState2 = useState(dimensionsConfig.defaultHeight),
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
50
|
+
outerHeight = _useState2[0],
|
|
51
|
+
setOuterHeight = _useState2[1];
|
|
66
52
|
var parameter = useMemo(function () {
|
|
67
53
|
return value;
|
|
68
54
|
}, [value]);
|
|
69
|
-
|
|
70
55
|
var _useMemo = useMemo(function () {
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
56
|
+
return {
|
|
57
|
+
isSelected: Boolean((parameter == null ? void 0 : parameter.icon) || (parameter == null ? void 0 : parameter.name)),
|
|
58
|
+
parameterIcon: (parameter == null ? void 0 : parameter.icon) || buttonIcon,
|
|
59
|
+
parameterName: (parameter == null ? void 0 : parameter.name) || buttonLabel
|
|
60
|
+
};
|
|
61
|
+
}, [parameter, buttonIcon, buttonLabel]),
|
|
62
|
+
parameterIcon = _useMemo.parameterIcon,
|
|
63
|
+
parameterName = _useMemo.parameterName,
|
|
64
|
+
isSelected = _useMemo.isSelected;
|
|
81
65
|
var handleChange = useCallback(function (val) {
|
|
82
66
|
onChange(val);
|
|
83
67
|
}, [onChange]);
|
|
@@ -88,19 +72,18 @@ var ParameterInput = function ParameterInput(_ref) {
|
|
|
88
72
|
}, [onParamsClick, onActivate]);
|
|
89
73
|
useEffect(function () {
|
|
90
74
|
setDropdownVisible(Boolean(opened));
|
|
91
|
-
|
|
92
75
|
if (opened) {
|
|
93
76
|
onParamsClick && onParamsClick();
|
|
94
77
|
onActivate && onActivate();
|
|
95
|
-
}
|
|
96
|
-
|
|
78
|
+
}
|
|
79
|
+
// eslint-disable-next-line
|
|
97
80
|
}, [opened]);
|
|
98
81
|
useEffect(function () {
|
|
99
|
-
!preventAutoloadData && onParamsClick && onParamsClick();
|
|
82
|
+
!preventAutoloadData && onParamsClick && onParamsClick();
|
|
83
|
+
// eslint-disable-next-line
|
|
100
84
|
}, []);
|
|
101
85
|
var onDropdownVisibilityChange = useCallback(function (newValue) {
|
|
102
86
|
newValue && onActivate && onActivate();
|
|
103
|
-
|
|
104
87
|
if (!newValue) {
|
|
105
88
|
onDeactivate && onDeactivate();
|
|
106
89
|
setDropdownVisible(false);
|
|
@@ -110,7 +93,6 @@ var ParameterInput = function ParameterInput(_ref) {
|
|
|
110
93
|
if (parameterIcon) {
|
|
111
94
|
return readOnly ? 'icon-label' : 'two-icons';
|
|
112
95
|
}
|
|
113
|
-
|
|
114
96
|
return readOnly ? 'simple' : 'label-icon';
|
|
115
97
|
}, [parameterIcon, readOnly]);
|
|
116
98
|
var triggerButton = /*#__PURE__*/React.createElement(Button, {
|
|
@@ -137,7 +119,6 @@ var ParameterInput = function ParameterInput(_ref) {
|
|
|
137
119
|
},
|
|
138
120
|
renderHoverTooltip: isSelected ? (parameter == null ? void 0 : parameter.renderHoverTooltip) || function () {
|
|
139
121
|
var _parameter$id;
|
|
140
|
-
|
|
141
122
|
return /*#__PURE__*/React.createElement(InformationCard, _extends({
|
|
142
123
|
icon: parameterIcon,
|
|
143
124
|
subtitle: (_parameter$id = parameter.id) == null ? void 0 : _parameter$id.toString(),
|
|
@@ -155,7 +136,6 @@ var ParameterInput = function ParameterInput(_ref) {
|
|
|
155
136
|
var checkViewportHeight = function checkViewportHeight() {
|
|
156
137
|
return setOuterHeight(window.innerHeight < dimensionsConfig.threshold ? dimensionsConfig.lowerHeight : dimensionsConfig.defaultHeight);
|
|
157
138
|
};
|
|
158
|
-
|
|
159
139
|
checkViewportHeight();
|
|
160
140
|
window.addEventListener('resize', checkViewportHeight);
|
|
161
141
|
return function () {
|
|
@@ -180,5 +160,4 @@ var ParameterInput = function ParameterInput(_ref) {
|
|
|
180
160
|
}))
|
|
181
161
|
}, trigger));
|
|
182
162
|
};
|
|
183
|
-
|
|
184
163
|
export default ParameterInput;
|
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
2
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
|
|
5
3
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
-
|
|
7
4
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
|
-
|
|
9
5
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
10
|
-
|
|
11
6
|
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
12
|
-
|
|
13
7
|
import React, { useRef, useState, useMemo, useCallback, useEffect } from 'react';
|
|
14
8
|
import { v4 as uuid } from 'uuid';
|
|
15
9
|
import Dropdown from '@synerise/ds-dropdown';
|
|
@@ -26,57 +20,48 @@ import ParameterDropdownItem from './ParameterDropdownItem';
|
|
|
26
20
|
import { groupItems } from './utils';
|
|
27
21
|
import { useGroups } from './useGroups';
|
|
28
22
|
import { DROPDOWN_HEIGHT, SEARCH_HEGIHT, TABS_HEIGHT, SUBGROUP_HEADER_HEIGHT, ITEM_SIZE, LIST_STYLE, NO_GROUP_NAME } from './Parameter.constants';
|
|
29
|
-
|
|
30
23
|
var isListTitle = function isListTitle(element) {
|
|
31
24
|
return element.title !== undefined;
|
|
32
25
|
};
|
|
33
|
-
|
|
34
26
|
var isDivider = function isDivider(item) {
|
|
35
27
|
return item.type === 'divider';
|
|
36
28
|
};
|
|
37
|
-
|
|
38
29
|
var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
39
30
|
var setSelected = _ref.setSelected,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
31
|
+
texts = _ref.texts,
|
|
32
|
+
groups = _ref.groups,
|
|
33
|
+
items = _ref.items,
|
|
34
|
+
recentItems = _ref.recentItems,
|
|
35
|
+
setDropdownVisible = _ref.setDropdownVisible,
|
|
36
|
+
loading = _ref.loading,
|
|
37
|
+
onFetchData = _ref.onFetchData,
|
|
38
|
+
hasMoreItems = _ref.hasMoreItems,
|
|
39
|
+
_ref$outerHeight = _ref.outerHeight,
|
|
40
|
+
outerHeight = _ref$outerHeight === void 0 ? DROPDOWN_HEIGHT : _ref$outerHeight,
|
|
41
|
+
value = _ref.value,
|
|
42
|
+
_ref$renderEmptyGroup = _ref.renderEmptyGroups,
|
|
43
|
+
renderEmptyGroups = _ref$renderEmptyGroup === void 0 ? false : _ref$renderEmptyGroup,
|
|
44
|
+
_ref$maxSearchResults = _ref.maxSearchResultsInGroup,
|
|
45
|
+
maxSearchResultsInGroup = _ref$maxSearchResults === void 0 ? 4 : _ref$maxSearchResults;
|
|
55
46
|
var listRef = useRef(null);
|
|
56
47
|
var overlayRef = useRef(null);
|
|
57
48
|
var scrollBarRef = useRef(null);
|
|
58
|
-
|
|
59
49
|
var _useGroups = useGroups(items, groups, renderEmptyGroups),
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
50
|
+
visibleGroups = _useGroups.visibleGroups,
|
|
51
|
+
tabs = _useGroups.tabs,
|
|
52
|
+
defaultTab = _useGroups.defaultTab;
|
|
64
53
|
var _useState = useState(''),
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
54
|
+
searchQuery = _useState[0],
|
|
55
|
+
setSearchQuery = _useState[1];
|
|
68
56
|
var _useState2 = useState(defaultTab),
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
57
|
+
activeTab = _useState2[0],
|
|
58
|
+
setActiveTab = _useState2[1];
|
|
72
59
|
var _useState3 = useState(undefined),
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
60
|
+
activeGroup = _useState3[0],
|
|
61
|
+
setActiveGroup = _useState3[1];
|
|
76
62
|
var _useState4 = useState(true),
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
63
|
+
searchInputCanBeFocused = _useState4[0],
|
|
64
|
+
setSearchInputFocus = _useState4[1];
|
|
80
65
|
var classNames = useMemo(function () {
|
|
81
66
|
return "ds-parameter-item ds-parameter-item-" + uuid();
|
|
82
67
|
}, []);
|
|
@@ -109,16 +94,14 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
109
94
|
var groupByGroupName = useCallback(function (dropdownItems, maxItemsInGroup) {
|
|
110
95
|
var itemsNumber = dropdownItems == null ? void 0 : dropdownItems.length;
|
|
111
96
|
var groupedItems = {};
|
|
112
|
-
|
|
113
97
|
for (var i = 0; i < itemsNumber; i += 1) {
|
|
114
|
-
var _item = dropdownItems[i];
|
|
115
|
-
|
|
98
|
+
var _item = dropdownItems[i];
|
|
99
|
+
// @ts-ignore
|
|
116
100
|
var groupName = _item.groupName || NO_GROUP_NAME;
|
|
117
101
|
var group = groupedItems[groupName] || [];
|
|
118
102
|
group.push(_item);
|
|
119
103
|
groupedItems[groupName] = group;
|
|
120
104
|
}
|
|
121
|
-
|
|
122
105
|
var resultItems = [];
|
|
123
106
|
Object.keys(groupedItems).forEach(function (key) {
|
|
124
107
|
if (key !== NO_GROUP_NAME && !activeGroup) {
|
|
@@ -127,7 +110,6 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
127
110
|
title: key
|
|
128
111
|
});
|
|
129
112
|
}
|
|
130
|
-
|
|
131
113
|
var maxGroupedItems = maxItemsInGroup ? groupedItems[key].slice(0, maxItemsInGroup) : groupedItems[key];
|
|
132
114
|
maxGroupedItems.forEach(function (item) {
|
|
133
115
|
var resultItem = !item.groupId ? {
|
|
@@ -146,7 +128,6 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
146
128
|
};
|
|
147
129
|
resultItems.push(resultItem);
|
|
148
130
|
});
|
|
149
|
-
|
|
150
131
|
if (maxItemsInGroup && groupedItems[key].length > maxItemsInGroup) {
|
|
151
132
|
var anyItem = maxGroupedItems[0];
|
|
152
133
|
resultItems.push({
|
|
@@ -165,10 +146,8 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
165
146
|
});
|
|
166
147
|
return resultItems;
|
|
167
148
|
}, [activeGroup, classNames, searchQuery, handleOnSetGroup, clearSearch, hideDropdown, setSelected, value, texts.parameter.showMore, groups]);
|
|
168
|
-
|
|
169
149
|
var _useSearchResults = useSearchResults(items || [], groups || [], activeTab, groupByGroupName, activeGroup, searchQuery, maxSearchResultsInGroup),
|
|
170
|
-
|
|
171
|
-
|
|
150
|
+
searchResults = _useSearchResults.searchResults;
|
|
172
151
|
var mapItemToDropdownItem = React.useCallback(function (item) {
|
|
173
152
|
return {
|
|
174
153
|
className: classNames,
|
|
@@ -182,9 +161,7 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
182
161
|
if (searchQuery) {
|
|
183
162
|
return searchResults;
|
|
184
163
|
}
|
|
185
|
-
|
|
186
164
|
var hasSubgroups = Boolean(currentTabItems == null ? void 0 : currentTabItems.subGroups);
|
|
187
|
-
|
|
188
165
|
if (hasSubgroups && !activeGroup) {
|
|
189
166
|
var groupedItems = (items || []).filter(function (item) {
|
|
190
167
|
return item.groupId === (currentTabItems == null ? void 0 : currentTabItems.id);
|
|
@@ -202,19 +179,16 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
202
179
|
});
|
|
203
180
|
return groupItems([].concat(groupedItems, subGroups), activeGroup);
|
|
204
181
|
}
|
|
205
|
-
|
|
206
182
|
if (activeGroup) {
|
|
207
183
|
return groupItems((items || []).filter(function (item) {
|
|
208
184
|
return item.groupId === activeGroup.id;
|
|
209
185
|
}).map(mapItemToDropdownItem), activeGroup);
|
|
210
186
|
}
|
|
211
|
-
|
|
212
187
|
if (activeTab && groups && groups[activeTab]) {
|
|
213
188
|
return groupItems((items || []).filter(function (item) {
|
|
214
189
|
return item.groupId === groups[activeTab].id;
|
|
215
190
|
}).map(mapItemToDropdownItem), activeGroup);
|
|
216
191
|
}
|
|
217
|
-
|
|
218
192
|
if (activeTab && visibleGroups && visibleGroups[activeTab]) {
|
|
219
193
|
return items == null ? void 0 : items.filter(function (item) {
|
|
220
194
|
return item.groupId === visibleGroups[activeTab].id;
|
|
@@ -228,7 +202,6 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
228
202
|
};
|
|
229
203
|
});
|
|
230
204
|
}
|
|
231
|
-
|
|
232
205
|
if ((recentItems || []).length > 0) {
|
|
233
206
|
var recentItemsWithGroup = (recentItems || []).map(function (item) {
|
|
234
207
|
return _objectSpread({}, item, {
|
|
@@ -243,7 +216,6 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
243
216
|
var result = groupByGroupName(recentItemsWithGroup.concat(itemsWithAllGroup));
|
|
244
217
|
return result;
|
|
245
218
|
}
|
|
246
|
-
|
|
247
219
|
return items == null ? void 0 : items.map(function (item) {
|
|
248
220
|
return {
|
|
249
221
|
className: classNames,
|
|
@@ -264,16 +236,13 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
264
236
|
description: texts.parameter.noResults
|
|
265
237
|
});
|
|
266
238
|
}, [texts]);
|
|
267
|
-
|
|
268
239
|
var handleScroll = function handleScroll(_ref2) {
|
|
269
240
|
var currentTarget = _ref2.currentTarget;
|
|
270
241
|
var scrollTop = currentTarget.scrollTop;
|
|
271
|
-
|
|
272
242
|
if (listRef.current) {
|
|
273
243
|
listRef.current.scrollTo(scrollTop);
|
|
274
244
|
}
|
|
275
245
|
};
|
|
276
|
-
|
|
277
246
|
useEffect(function () {
|
|
278
247
|
if (scrollBarRef.current && listRef.current) {
|
|
279
248
|
scrollBarRef.current.scrollTo({
|
|
@@ -282,13 +251,11 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
282
251
|
listRef.current.resetAfterIndex(0);
|
|
283
252
|
}
|
|
284
253
|
}, [searchQuery, activeGroup, activeTab]);
|
|
285
|
-
|
|
286
254
|
var getItemSize = function getItemSize(index) {
|
|
287
255
|
var item = currentItems && currentItems[index];
|
|
288
256
|
if (isListTitle(item)) return ITEM_SIZE.title;
|
|
289
257
|
return ITEM_SIZE[itemSizes.DEFAULT];
|
|
290
258
|
};
|
|
291
|
-
|
|
292
259
|
var hasTabs = tabs.length > 1;
|
|
293
260
|
var hasSearch = Boolean(searchQuery);
|
|
294
261
|
var dropdownContentHeight = useMemo(function () {
|
|
@@ -302,8 +269,8 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
302
269
|
},
|
|
303
270
|
ref: overlayRef,
|
|
304
271
|
onKeyDown: function onKeyDown(event) {
|
|
305
|
-
setSearchInputFocus(false);
|
|
306
|
-
|
|
272
|
+
setSearchInputFocus(false);
|
|
273
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
307
274
|
searchQuery && focusWithArrowKeys(event, classNames.split(' ')[1], function () {
|
|
308
275
|
setSearchInputFocus(true);
|
|
309
276
|
});
|
|
@@ -361,9 +328,8 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
361
328
|
ref: listRef
|
|
362
329
|
}, function (_ref3) {
|
|
363
330
|
var index = _ref3.index,
|
|
364
|
-
|
|
331
|
+
style = _ref3.style;
|
|
365
332
|
var listItem = currentItems[index];
|
|
366
|
-
|
|
367
333
|
if (listItem && isDivider(listItem)) {
|
|
368
334
|
return /*#__PURE__*/React.createElement("div", {
|
|
369
335
|
style: style
|
|
@@ -372,7 +338,6 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
372
338
|
marginBottom: 8
|
|
373
339
|
}));
|
|
374
340
|
}
|
|
375
|
-
|
|
376
341
|
return isListTitle(listItem) ? /*#__PURE__*/React.createElement(S.Title, {
|
|
377
342
|
style: style
|
|
378
343
|
}, listItem.title) : /*#__PURE__*/React.createElement(ParameterDropdownItem, _extends({
|
|
@@ -380,5 +345,4 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
|
|
|
380
345
|
}, listItem));
|
|
381
346
|
})) : getNoResultContainer));
|
|
382
347
|
};
|
|
383
|
-
|
|
384
348
|
export default ParameterDropdown;
|
|
@@ -1,27 +1,21 @@
|
|
|
1
1
|
var _excluded = ["id", "icon"];
|
|
2
|
-
|
|
3
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
4
|
-
|
|
5
3
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
6
|
-
|
|
7
4
|
import React from 'react';
|
|
8
5
|
import Icon from '@synerise/ds-icon';
|
|
9
6
|
import ListItem from '@synerise/ds-list-item';
|
|
10
|
-
|
|
11
7
|
var ParameterDropdownItem = function ParameterDropdownItem(_ref) {
|
|
12
8
|
var item = _ref.item,
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
9
|
+
clearSearch = _ref.clearSearch,
|
|
10
|
+
searchQuery = _ref.searchQuery,
|
|
11
|
+
hideDropdown = _ref.hideDropdown,
|
|
12
|
+
select = _ref.select,
|
|
13
|
+
className = _ref.className,
|
|
14
|
+
style = _ref.style,
|
|
15
|
+
label = _ref.label;
|
|
21
16
|
var id = item.id,
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
17
|
+
icon = item.icon,
|
|
18
|
+
itemProps = _objectWithoutPropertiesLoose(item, _excluded);
|
|
25
19
|
return /*#__PURE__*/React.createElement(ListItem, _extends({}, itemProps, {
|
|
26
20
|
style: style,
|
|
27
21
|
className: className,
|
|
@@ -37,5 +31,4 @@ var ParameterDropdownItem = function ParameterDropdownItem(_ref) {
|
|
|
37
31
|
}
|
|
38
32
|
}), label || item.name);
|
|
39
33
|
};
|
|
40
|
-
|
|
41
34
|
export default ParameterDropdownItem;
|
|
@@ -1,19 +1,12 @@
|
|
|
1
1
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
2
|
-
|
|
3
2
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
|
|
5
3
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
6
|
-
|
|
7
4
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
8
|
-
|
|
9
5
|
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
10
|
-
|
|
11
6
|
import { useMemo } from 'react';
|
|
12
|
-
|
|
13
7
|
var itemIsParameterGroup = function itemIsParameterGroup(item) {
|
|
14
8
|
return Boolean(item);
|
|
15
9
|
};
|
|
16
|
-
|
|
17
10
|
export var useGroups = function useGroups(items, groups, renderEmptyGroups) {
|
|
18
11
|
var defaultTab = useMemo(function () {
|
|
19
12
|
var defaultIndex = groups == null ? void 0 : groups.findIndex(function (group) {
|
|
@@ -25,7 +18,6 @@ export var useGroups = function useGroups(items, groups, renderEmptyGroups) {
|
|
|
25
18
|
if (renderEmptyGroups) {
|
|
26
19
|
return groups;
|
|
27
20
|
}
|
|
28
|
-
|
|
29
21
|
var groupIds = groups == null ? void 0 : groups.map(function (group) {
|
|
30
22
|
return group.subGroups || group;
|
|
31
23
|
}).flat().filter(function (group, index) {
|
|
@@ -43,23 +35,19 @@ export var useGroups = function useGroups(items, groups, renderEmptyGroups) {
|
|
|
43
35
|
var filteredSubGroups = group.subGroups.filter(function (subGroup) {
|
|
44
36
|
return !(groupsToSkip != null && groupsToSkip.includes(subGroup.id));
|
|
45
37
|
});
|
|
46
|
-
|
|
47
38
|
switch (filteredSubGroups.length) {
|
|
48
39
|
case 0:
|
|
49
40
|
return undefined;
|
|
50
|
-
|
|
51
41
|
case 1:
|
|
52
42
|
return _objectSpread({}, filteredSubGroups[0], {
|
|
53
43
|
icon: undefined
|
|
54
44
|
});
|
|
55
|
-
|
|
56
45
|
default:
|
|
57
46
|
return _objectSpread({}, group, {
|
|
58
47
|
subGroups: filteredSubGroups
|
|
59
48
|
});
|
|
60
49
|
}
|
|
61
50
|
}
|
|
62
|
-
|
|
63
51
|
return groupsToSkip != null && groupsToSkip.includes(group.id) ? undefined : group;
|
|
64
52
|
}).filter(itemIsParameterGroup);
|
|
65
53
|
return cleanGroups;
|
|
@@ -3,7 +3,6 @@ export var groupItems = function groupItems(dropdownItems, activeGroup) {
|
|
|
3
3
|
var itemsNumber = dropdownItems.length;
|
|
4
4
|
var groupedItems = {};
|
|
5
5
|
var resultItems = [];
|
|
6
|
-
|
|
7
6
|
for (var i = 0; i < itemsNumber; i += 1) {
|
|
8
7
|
var item = dropdownItems[i];
|
|
9
8
|
var groupName = item.item.groupName || NO_GROUP_NAME;
|
|
@@ -11,7 +10,6 @@ export var groupItems = function groupItems(dropdownItems, activeGroup) {
|
|
|
11
10
|
group.push(item);
|
|
12
11
|
groupedItems[groupName] = group;
|
|
13
12
|
}
|
|
14
|
-
|
|
15
13
|
Object.keys(groupedItems).forEach(function (key, index) {
|
|
16
14
|
if (key !== NO_GROUP_NAME && !activeGroup) {
|
|
17
15
|
if (index > 0) {
|
|
@@ -19,13 +17,11 @@ export var groupItems = function groupItems(dropdownItems, activeGroup) {
|
|
|
19
17
|
type: 'divider'
|
|
20
18
|
});
|
|
21
19
|
}
|
|
22
|
-
|
|
23
20
|
resultItems.push({
|
|
24
21
|
type: 'title',
|
|
25
22
|
title: key
|
|
26
23
|
});
|
|
27
24
|
}
|
|
28
|
-
|
|
29
25
|
resultItems = resultItems.concat(groupedItems[key]);
|
|
30
26
|
});
|
|
31
27
|
return resultItems;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
2
|
import React, { useCallback, useEffect, useMemo, useState, useRef } from 'react';
|
|
4
3
|
import { debounce } from 'lodash';
|
|
5
4
|
import Icon, { FullScreenM } from '@synerise/ds-icon';
|
|
@@ -8,38 +7,32 @@ import Autocomplete from '@synerise/ds-autocomplete';
|
|
|
8
7
|
import { Input } from '@synerise/ds-input';
|
|
9
8
|
import * as S from './Text.styles';
|
|
10
9
|
import TextModal from './TextModal';
|
|
11
|
-
|
|
12
10
|
var TextInput = function TextInput(_ref) {
|
|
13
11
|
var value = _ref.value,
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
12
|
+
onChange = _ref.onChange,
|
|
13
|
+
texts = _ref.texts,
|
|
14
|
+
textType = _ref.textType,
|
|
15
|
+
autocompleteText = _ref.autocompleteText,
|
|
16
|
+
factorType = _ref.factorType,
|
|
17
|
+
opened = _ref.opened,
|
|
18
|
+
onDeactivate = _ref.onDeactivate,
|
|
19
|
+
error = _ref.error,
|
|
20
|
+
inputProps = _ref.inputProps,
|
|
21
|
+
getPopupContainerOverride = _ref.getPopupContainerOverride,
|
|
22
|
+
_ref$readOnly = _ref.readOnly,
|
|
23
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly;
|
|
27
24
|
var _useState = useState(false),
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
25
|
+
openExpanseEditor = _useState[0],
|
|
26
|
+
setOpenExpanseEditor = _useState[1];
|
|
31
27
|
var _useState2 = useState(),
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
28
|
+
inputRef = _useState2[0],
|
|
29
|
+
setInputRef = _useState2[1];
|
|
35
30
|
var _useState3 = useState(value),
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
31
|
+
localValue = _useState3[0],
|
|
32
|
+
setLocalValue = _useState3[1];
|
|
39
33
|
var _useState4 = useState(false),
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
34
|
+
localError = _useState4[0],
|
|
35
|
+
setLocalError = _useState4[1];
|
|
43
36
|
var onChangeRef = useRef(onChange);
|
|
44
37
|
useEffect(function () {
|
|
45
38
|
if (inputRef != null && inputRef.current && opened) {
|
|
@@ -63,7 +56,6 @@ var TextInput = function TextInput(_ref) {
|
|
|
63
56
|
var handleChange = useCallback(function (event) {
|
|
64
57
|
setLocalValue(event.target.value);
|
|
65
58
|
debouncedOnChange(event.target.value);
|
|
66
|
-
|
|
67
59
|
if (!event.target.value.length) {
|
|
68
60
|
setLocalError(true);
|
|
69
61
|
} else {
|
|
@@ -84,7 +76,6 @@ var TextInput = function TextInput(_ref) {
|
|
|
84
76
|
return option.toLowerCase().includes(String(localValue).toLowerCase());
|
|
85
77
|
}) || [];
|
|
86
78
|
}, [localValue, autocompleteText]);
|
|
87
|
-
|
|
88
79
|
var renderInput = function renderInput(typesOfInput, factorsType) {
|
|
89
80
|
if (typesOfInput === 'autocomplete' && factorsType === 'text') {
|
|
90
81
|
return /*#__PURE__*/React.createElement(Autocomplete, _extends({}, inputProps, {
|
|
@@ -104,7 +95,6 @@ var TextInput = function TextInput(_ref) {
|
|
|
104
95
|
}, option);
|
|
105
96
|
}));
|
|
106
97
|
}
|
|
107
|
-
|
|
108
98
|
if (typesOfInput === 'default' && factorsType === 'text') {
|
|
109
99
|
return /*#__PURE__*/React.createElement(S.InputWrapper, null, /*#__PURE__*/React.createElement(Input, _extends({}, inputProps, {
|
|
110
100
|
handleInputRef: setInputRef,
|
|
@@ -116,7 +106,6 @@ var TextInput = function TextInput(_ref) {
|
|
|
116
106
|
readOnly: readOnly
|
|
117
107
|
})));
|
|
118
108
|
}
|
|
119
|
-
|
|
120
109
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(S.InputWrapper, null, /*#__PURE__*/React.createElement(Input, _extends({}, inputProps, {
|
|
121
110
|
handleInputRef: setInputRef,
|
|
122
111
|
placeholder: texts.valuePlaceholder,
|
|
@@ -145,10 +134,8 @@ var TextInput = function TextInput(_ref) {
|
|
|
145
134
|
texts: texts
|
|
146
135
|
}));
|
|
147
136
|
};
|
|
148
|
-
|
|
149
137
|
return /*#__PURE__*/React.createElement(S.TextWrapper, {
|
|
150
138
|
"data-testid": "ds-factors-" + factorType + "-" + textType
|
|
151
139
|
}, renderInput(textType, factorType));
|
|
152
140
|
};
|
|
153
|
-
|
|
154
141
|
export default TextInput;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
1
|
+
import styled from 'styled-components';
|
|
2
2
|
|
|
3
|
+
// eslint-disable-next-line import/prefer-default-export
|
|
3
4
|
export var IconWrapper = styled.span.withConfig({
|
|
4
5
|
displayName: "Textstyles__IconWrapper",
|
|
5
6
|
componentId: "rjr8p0-0"
|