@dreamcommerce/aurora 2.1.10-6 → 2.1.10-8
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/build/cjs/packages/aurora/src/components/controls/hoc/control_select/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/dropdown/hoc/select/index.js +7 -2
- package/build/cjs/packages/aurora/src/components/dropdown/hoc/select/index.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js +47 -6
- package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js +12 -6
- package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js.map +1 -1
- package/build/cjs/packages/aurora/src/css/dropdown/main.module.less.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_select/index.js +2 -2
- package/build/esm/packages/aurora/src/components/dropdown/hoc/select/index.js +8 -3
- package/build/esm/packages/aurora/src/components/dropdown/hoc/select/index.js.map +1 -1
- package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js +47 -6
- package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js.map +1 -1
- package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select_types.d.ts +3 -1
- package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js +12 -6
- package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js.map +1 -1
- package/build/esm/packages/aurora/src/components/dropdown/types.d.ts +2 -1
- package/build/esm/packages/aurora/src/css/dropdown/main.module.less.js +2 -2
- package/package.json +2 -2
|
@@ -26,14 +26,14 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
|
26
26
|
* />
|
|
27
27
|
* )
|
|
28
28
|
*/
|
|
29
|
-
const ControlSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint, hintOptions = { isFixed: true }, placeholder, additionalInfo, onScroll, innerAdditionalContent }) => {
|
|
29
|
+
const ControlSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint, hintOptions = { isFixed: true }, placeholder, additionalInfo, onScroll, innerAdditionalContent, onSearch }) => {
|
|
30
30
|
return (React__default['default'].createElement(index['default'], { errors: errors, name: name, id: id },
|
|
31
31
|
(label || hint) && (React__default['default'].createElement(index['default'].Label, { id: id, isRequired: isRequired },
|
|
32
32
|
label,
|
|
33
33
|
hint && React__default['default'].createElement(index$1['default'], { fixed: hintOptions.isFixed, spacingLeft: true, hint: hint }))),
|
|
34
34
|
React__default['default'].createElement(index['default'].Content, null,
|
|
35
35
|
React__default['default'].createElement(index['default'].Element, null,
|
|
36
|
-
React__default['default'].createElement(index$2['default'], { key: name, name: name, options: options, defaultValues: defaultValues, isWithGroups: isWithGroups, isWithSearch: isWithSearch, defaultIsOpen: defaultIsOpen, defaultCloseOnClick: defaultCloseOnClick, isReadonly: isReadonly, isDisabled: isDisabled, placeholder: placeholder, onChange: onChange, onToggle: onToggle, onScroll: onScroll, innerAdditionalContent: innerAdditionalContent }))),
|
|
36
|
+
React__default['default'].createElement(index$2['default'], { key: name, name: name, options: options, defaultValues: defaultValues, isWithGroups: isWithGroups, isWithSearch: isWithSearch, defaultIsOpen: defaultIsOpen, defaultCloseOnClick: defaultCloseOnClick, isReadonly: isReadonly, isDisabled: isDisabled, placeholder: placeholder, onChange: onChange, onToggle: onToggle, onScroll: onScroll, innerAdditionalContent: innerAdditionalContent, onSearch: onSearch }))),
|
|
37
37
|
React__default['default'].createElement(index['default'].Errors, null),
|
|
38
38
|
additionalInfo && React__default['default'].createElement(index['default'].AdditionalInfo, null, additionalInfo)));
|
|
39
39
|
};
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
+
var debounce = require('../../../../../../../external/lodash/debounce.js');
|
|
6
7
|
var index = require('../../context/index.js');
|
|
7
8
|
var css_classes = require('../../css_classes.js');
|
|
8
9
|
var main_module = require('../../../../css/dropdown/main.module.less.js');
|
|
@@ -83,7 +84,7 @@ onChange,
|
|
|
83
84
|
* Place where portal should be placed, by default to body
|
|
84
85
|
* this can be used to put modal inside modal
|
|
85
86
|
*/
|
|
86
|
-
portalContainer, placeholder, onScroll, innerAdditionalContent }) => {
|
|
87
|
+
portalContainer, placeholder, onScroll, innerAdditionalContent, onSearch }) => {
|
|
87
88
|
/**
|
|
88
89
|
* reference to dropdown wrapper element
|
|
89
90
|
*/
|
|
@@ -108,6 +109,10 @@ portalContainer, placeholder, onScroll, innerAdditionalContent }) => {
|
|
|
108
109
|
* hook which resets options list to default on close if select has search and it was used
|
|
109
110
|
*/
|
|
110
111
|
use_set_options_on_close.useSetOptionsOnClose(isWithSearch, isOpen, setOptionsList, options);
|
|
112
|
+
const handleSearch = debounce['default']((ev) => {
|
|
113
|
+
onSearch && onSearch(ev);
|
|
114
|
+
utilities.handleSearchKeyUp(ev, options, setOptionsList);
|
|
115
|
+
}, 400);
|
|
111
116
|
React.useEffect(() => {
|
|
112
117
|
setOptionsList(options);
|
|
113
118
|
}, [options]);
|
|
@@ -115,7 +120,7 @@ portalContainer, placeholder, onScroll, innerAdditionalContent }) => {
|
|
|
115
120
|
React__default['default'].createElement("div", { ref: wrapperRef, className: main_module['default'][css_classes.cssDropdown] },
|
|
116
121
|
React__default['default'].createElement(index$1['default'].Select, { name: name, isReadonly: isReadonly, isDisabled: isDisabled, selectedOptions: selectedValues, placeholder: placeholder, onRemoveOptions: setSelectedValues }),
|
|
117
122
|
React__default['default'].createElement(index$1['default'].Content, { portalContainer: portalContainer },
|
|
118
|
-
isWithSearch && React__default['default'].createElement(index$1['default'].Search, { onKeyUp: (ev) =>
|
|
123
|
+
isWithSearch && React__default['default'].createElement(index$1['default'].Search, { onKeyUp: (ev) => handleSearch(ev) }),
|
|
119
124
|
React__default['default'].createElement(index$1['default'].List, { isWithGroups: isWithGroups, onScroll: onScroll }, optionsList === null || optionsList === void 0 ? void 0 :
|
|
120
125
|
optionsList.map((option) => {
|
|
121
126
|
var _a, _b;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,uBAAuB,kDAAsD;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js
CHANGED
|
@@ -12,6 +12,7 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
12
12
|
const [errors, setErrors] = React.useState({});
|
|
13
13
|
const [isFetchingInitialData, setIsFetchingInitialData] = React.useState(true);
|
|
14
14
|
const [scrollTimer, setScrollTimer] = React.useState();
|
|
15
|
+
const [search, setSearch] = React.useState('');
|
|
15
16
|
const [t] = useTranslation.useTranslation();
|
|
16
17
|
const xhrSelectResponseParser = new xhr_select_response_parser.XhrSelectResponseParser();
|
|
17
18
|
const loadDataOnScroll = (event) => {
|
|
@@ -33,14 +34,15 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
33
34
|
page: extraLoadedSelectorData.page,
|
|
34
35
|
list: [...selectorData.list, ...extraLoadedSelectorData.list]
|
|
35
36
|
};
|
|
36
|
-
|
|
37
|
+
setSelectorData(newSelectorData);
|
|
37
38
|
},
|
|
38
39
|
handleCatchErrors: () => {
|
|
39
40
|
setErrors({
|
|
40
41
|
...errors,
|
|
41
|
-
|
|
42
|
+
scrollError: t('Failed to load')
|
|
42
43
|
});
|
|
43
|
-
}
|
|
44
|
+
},
|
|
45
|
+
search
|
|
44
46
|
});
|
|
45
47
|
}, xhr_select_constants.SCROLL_FETCH_TIMEOUT_IN_MS)));
|
|
46
48
|
};
|
|
@@ -52,6 +54,44 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
52
54
|
scrollError: ''
|
|
53
55
|
});
|
|
54
56
|
};
|
|
57
|
+
const loadDataOnSearch = (ev) => {
|
|
58
|
+
if ((selectorData === null || selectorData === void 0 ? void 0 : selectorData.page) === (selectorData === null || selectorData === void 0 ? void 0 : selectorData.pages))
|
|
59
|
+
return;
|
|
60
|
+
// to jest trochę nieczyste bo z jednej strony amamy search a z drugiej currentSearch i
|
|
61
|
+
// trzebaby to jakoś ładnie zrobić
|
|
62
|
+
const currentSearch = ev.target.value;
|
|
63
|
+
if (currentSearch === search)
|
|
64
|
+
return;
|
|
65
|
+
setSearch(currentSearch);
|
|
66
|
+
if (search === '') {
|
|
67
|
+
fetchXhrData({
|
|
68
|
+
url,
|
|
69
|
+
handleData: (selectorDataFromSearchResults) => {
|
|
70
|
+
setSelectorData(selectorDataFromSearchResults);
|
|
71
|
+
},
|
|
72
|
+
handleCatchErrors: () => {
|
|
73
|
+
setErrors({
|
|
74
|
+
...errors,
|
|
75
|
+
fetchError: t('Failed to load data. Please refresh the page and try again.')
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
});
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
fetchXhrData({
|
|
82
|
+
url,
|
|
83
|
+
handleData: (selectorDataFromSearchResults) => {
|
|
84
|
+
setSelectorData(selectorDataFromSearchResults);
|
|
85
|
+
},
|
|
86
|
+
handleCatchErrors: () => {
|
|
87
|
+
setErrors({
|
|
88
|
+
...errors,
|
|
89
|
+
scrollError: t('Failed to load')
|
|
90
|
+
});
|
|
91
|
+
},
|
|
92
|
+
search
|
|
93
|
+
});
|
|
94
|
+
};
|
|
55
95
|
React.useEffect(() => {
|
|
56
96
|
fetchXhrData({
|
|
57
97
|
url: `${url}?show-recent=1`,
|
|
@@ -71,9 +111,9 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
71
111
|
};
|
|
72
112
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
73
113
|
}, [url]);
|
|
74
|
-
const fetchXhrData = ({ url, handleData, handleCatchErrors }) => {
|
|
114
|
+
const fetchXhrData = ({ url, handleData, handleCatchErrors, search }) => {
|
|
75
115
|
fetchClient
|
|
76
|
-
.fetch({ method: 'get', url })
|
|
116
|
+
.fetch({ method: 'get', url: search ? `${url}?search=${search}` : url })
|
|
77
117
|
.then((selectorDataResponseDTO) => {
|
|
78
118
|
const selectorData = xhrSelectResponseParser.parse(selectorDataResponseDTO.data);
|
|
79
119
|
handleData(selectorData);
|
|
@@ -86,7 +126,8 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
86
126
|
selectorData,
|
|
87
127
|
errors,
|
|
88
128
|
isFetchingInitialData,
|
|
89
|
-
loadDataOnScroll
|
|
129
|
+
loadDataOnScroll,
|
|
130
|
+
loadDataOnSearch
|
|
90
131
|
};
|
|
91
132
|
};
|
|
92
133
|
|
package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,0EAA8E;AAC3G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,0EAA8E;AAC3G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -19,7 +19,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
19
19
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
20
20
|
|
|
21
21
|
const XhrSelect = ({ url, headerTitle, noItemsErrorMessage, onScroll, fetchClient = new axios_http_client.AxiosClient(), ...props }) => {
|
|
22
|
-
const { selectorData, errors, isFetchingInitialData, loadDataOnScroll } = use_xhr_select.useXhrSelect({ url, fetchClient });
|
|
22
|
+
const { selectorData, errors, isFetchingInitialData, loadDataOnScroll, loadDataOnSearch } = use_xhr_select.useXhrSelect({ url, fetchClient });
|
|
23
23
|
const [t] = useTranslation.useTranslation();
|
|
24
24
|
const mapSelectorDataToSelectOptions = (selectorData) => {
|
|
25
25
|
const recentSelectorOptions = selectorData.recent
|
|
@@ -56,9 +56,9 @@ const XhrSelect = ({ url, headerTitle, noItemsErrorMessage, onScroll, fetchClien
|
|
|
56
56
|
"..."));
|
|
57
57
|
if (!(selectorData === null || selectorData === void 0 ? void 0 : selectorData.list.length))
|
|
58
58
|
return React__default['default'].createElement(index['default'], { type: "alert" }, noItemsErrorMessage);
|
|
59
|
-
return (React__default['default'].createElement(index$2['default'], { ...props, isWithSearch: true, options: mapSelectorDataToSelectOptions(selectorData), onScroll: loadDataOnScroll, innerAdditionalContent: React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
59
|
+
return (React__default['default'].createElement(index$2['default'], { ...props, isWithSearch: true, options: mapSelectorDataToSelectOptions(selectorData), onScroll: loadDataOnScroll, onSearch: loadDataOnSearch, innerAdditionalContent: React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
60
60
|
errors.scrollError && (React__default['default'].createElement("div", { className: main_module['default'][css_classes.cssSelectError] },
|
|
61
|
-
React__default['default'].createElement(icon_warning['default'], { className: main_module['default'][css_classes.cssSelectErrorIcon] }),
|
|
61
|
+
React__default['default'].createElement(icon_warning['default'], { size: "m", className: main_module['default'][css_classes.cssSelectErrorIcon] }),
|
|
62
62
|
errors.scrollError)),
|
|
63
63
|
(selectorData === null || selectorData === void 0 ? void 0 : selectorData.page) !== (selectorData === null || selectorData === void 0 ? void 0 : selectorData.pages) && !errors.scrollError && (React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
64
64
|
React__default['default'].createElement(index$1['default'], null),
|
|
@@ -67,10 +67,16 @@ const XhrSelect = ({ url, headerTitle, noItemsErrorMessage, onScroll, fetchClien
|
|
|
67
67
|
};
|
|
68
68
|
// X skąd wziąć abortującego fetcha?
|
|
69
69
|
// X cofanie requestów w useEffectie
|
|
70
|
-
// napisz ręcznie w storybooku xhr selecta
|
|
71
|
-
// popraw error message dla scrollErrora
|
|
70
|
+
// X napisz ręcznie w storybooku xhr selecta
|
|
71
|
+
// X popraw error message dla scrollErrora
|
|
72
72
|
// napisz testy jednostkowe
|
|
73
|
-
|
|
73
|
+
/////////////////////////////////////////
|
|
74
|
+
// dopisz obsługę searcha (debounce):
|
|
75
|
+
// jak wyszukujesz z xhr to wrzuć debounce z pół sekundy minimum
|
|
76
|
+
// jak skończysz wyszukiwać, to przywróć wcześniej zfetchowane wyniki,
|
|
77
|
+
// więc jeśli były zfetchowane 2 strony, to przywróć 2 strony już bez potrzeby fetchowania ten jeden dodatkowy raz
|
|
78
|
+
// kiedy usuniesz wyszukiwanie
|
|
79
|
+
////////////////////////////////////////////
|
|
74
80
|
// wyczyść kod
|
|
75
81
|
// handleData to średnia nazwa w fetchXhrdata
|
|
76
82
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,uEAA2E;AACxG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,uEAA2E;AACxG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var styleInject_es = require('../../../../../external/style-inject/dist/style-inject.es.js');
|
|
6
6
|
|
|
7
|
-
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n@media (max-width: 576px) {\n .main-module_dropdown__content__X9kz_ {\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n .main-module_dropdown__header__kvhNn {\n display: block;\n }\n .main-module_dropdown__header-title__7NXxw {\n margin-left: 0.5rem;\n }\n}\n@media (min-width: 576px) {\n .main-module_dropdown__header__kvhNn {\n display: none;\n }\n}\n.main-module_dropdown__36KKf {\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.main-module_dropdown__content__X9kz_ {\n flex: 0 0 auto;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 1200;\n width: auto;\n padding: 0.5rem 0;\n background-color: #ffffff;\n border-radius: 3px;\n box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.2);\n}\n.main-module_dropdown__content__X9kz_::before {\n content: '';\n display: block;\n position: absolute;\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-style: solid;\n border-color: transparent transparent #ffffff transparent;\n}\n.main-module_dropdown__content_right__Rp4hR::before {\n right: 7px;\n left: auto;\n}\n.main-module_dropdown__content_bottom__1OlNP::before {\n top: auto;\n bottom: -14px;\n border-color: #ffffff transparent transparent transparent;\n}\n.main-module_dropdown__item-with-hover__3g-Za {\n pointer-events: all;\n}\n.main-module_dropdown__item-with-hover__3g-Za:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list__2bd_r {\n flex: 0 0 auto;\n padding: 0;\n width: 100%;\n min-width: 20rem;\n text-align: left;\n font-size: 14px;\n font-size: 1rem;\n}\n.main-module_dropdown__list__2bd_r > li {\n list-style: none;\n}\n.main-module_dropdown__list-head__2Uyb0 {\n padding: 0.5rem 0 0.5rem 1rem;\n}\n.main-module_dropdown__list_with-scroll__KP9yO {\n scrollbar-color: #79829c #ffffff;\n scrollbar-width: thin;\n max-height: 280px;\n overflow-y: auto;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar {\n width: 7px;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track {\n background-color: #ffffff;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track:hover {\n background-color: #f3f4f8;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb {\n background-color: #5c657e;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb:hover {\n background-color: #2d3748;\n}\n.main-module_dropdown__list-item__1u185 {\n display: block;\n padding: 0.5rem 1rem;\n cursor: default;\n}\n.main-module_dropdown__list-item__1u185:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_selected__2GYQr {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_disabled__1Psh7 {\n color: #abb4cd;\n}\n.main-module_dropdown__list-item_readonly__3bbj0 {\n color: #abb4cd;\n}\n.main-module_dropdown__search__1Moob {\n padding: 0.5rem 1rem 0.5rem;\n}\n.main-module_dropdown__header__kvhNn {\n margin: calc(1rem * 0.5) 1rem;\n}\n.main-module_dropdown__header-content__10Zg9 {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.main-module_dropdown__header-icon__30vfb {\n margin-right: 1rem;\n color: #abb4cd;\n font-size: 10px;\n font-size: 0.7142857142857143rem;\n}\n.main-module_dropdown__header-title__7NXxw {\n font-weight: 600;\n color: #5c657e;\n}\n.main-module_dropdown__error__1oS0H {\n display: flex;\n align-items: center;\n color: #e60c54;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_dropdown__error-icon__3OLzE {\n fill: #e60c54;\n}\n.main-module_dropdown__additional-info__1aTtM {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_select__1ocPo {\n position: relative;\n display: flex;\n flex: 0 2 auto;\n align-items: center;\n width: 100%;\n}\n.main-module_select__1ocPo::after {\n content: '';\n position: absolute;\n display: block;\n right: 0.715em;\n width: 7px;\n height: 7px;\n transform: translateY(-25%) rotate(-45deg);\n border-width: 0 0 1px 1px;\n border-style: solid;\n border-color: #3c83ec;\n}\n.main-module_select__1ocPo input {\n width: 100%;\n text-overflow: ellipsis;\n}\n.main-module_select__error__35ns4 {\n color:
|
|
8
|
-
var cssClasses = {"dropdown__content":"main-module_dropdown__content__X9kz_","dropdown__header":"main-module_dropdown__header__kvhNn","dropdown__header-title":"main-module_dropdown__header-title__7NXxw","dropdown":"main-module_dropdown__36KKf","dropdown__content_right":"main-module_dropdown__content_right__Rp4hR","dropdown__content_bottom":"main-module_dropdown__content_bottom__1OlNP","dropdown__item-with-hover":"main-module_dropdown__item-with-hover__3g-Za","dropdown__list":"main-module_dropdown__list__2bd_r","dropdown__list-head":"main-module_dropdown__list-head__2Uyb0","dropdown__list_with-scroll":"main-module_dropdown__list_with-scroll__KP9yO","dropdown__list-item":"main-module_dropdown__list-item__1u185","dropdown__list-item_selected":"main-module_dropdown__list-item_selected__2GYQr","dropdown__list-item_disabled":"main-module_dropdown__list-item_disabled__1Psh7","dropdown__list-item_readonly":"main-module_dropdown__list-item_readonly__3bbj0","dropdown__search":"main-module_dropdown__search__1Moob","dropdown__header-content":"main-module_dropdown__header-content__10Zg9","dropdown__header-icon":"main-module_dropdown__header-icon__30vfb","dropdown__error":"main-module_dropdown__error__1oS0H","dropdown__error-icon":"main-module_dropdown__error-icon__3OLzE","dropdown__additional-info":"main-module_dropdown__additional-info__1aTtM","select":"main-module_select__1ocPo","select__error":"main-module_select__error__35ns4","dropdown-enter":"main-module_dropdown-enter__2RGtd","modal-enter":"main-module_modal-enter__I5ELD","mask-enter":"main-module_mask-enter__32s5F","dropdown-enter-active":"main-module_dropdown-enter-active__ob1fb","modal-enter-active":"main-module_modal-enter-active__3BMYq","mask-enter-active":"main-module_mask-enter-active__1WgVf","dropdown-exit":"main-module_dropdown-exit__3b2wX","modal-exit":"main-module_modal-exit__y2N_F","mask-exit":"main-module_mask-exit__325a4","dropdown-exit-active":"main-module_dropdown-exit-active__22rth","modal-exit-active":"main-module_modal-exit-active__ID7ce","mask-exit-active":"main-module_mask-exit-active__2qs-r"};
|
|
7
|
+
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n@media (max-width: 576px) {\n .main-module_dropdown__content__X9kz_ {\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n .main-module_dropdown__header__kvhNn {\n display: block;\n }\n .main-module_dropdown__header-title__7NXxw {\n margin-left: 0.5rem;\n }\n}\n@media (min-width: 576px) {\n .main-module_dropdown__header__kvhNn {\n display: none;\n }\n}\n.main-module_dropdown__36KKf {\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.main-module_dropdown__content__X9kz_ {\n flex: 0 0 auto;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 1200;\n width: auto;\n padding: 0.5rem 0;\n background-color: #ffffff;\n border-radius: 3px;\n box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.2);\n}\n.main-module_dropdown__content__X9kz_::before {\n content: '';\n display: block;\n position: absolute;\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-style: solid;\n border-color: transparent transparent #ffffff transparent;\n}\n.main-module_dropdown__content_right__Rp4hR::before {\n right: 7px;\n left: auto;\n}\n.main-module_dropdown__content_bottom__1OlNP::before {\n top: auto;\n bottom: -14px;\n border-color: #ffffff transparent transparent transparent;\n}\n.main-module_dropdown__item-with-hover__3g-Za {\n pointer-events: all;\n}\n.main-module_dropdown__item-with-hover__3g-Za:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list__2bd_r {\n flex: 0 0 auto;\n padding: 0;\n width: 100%;\n min-width: 20rem;\n text-align: left;\n font-size: 14px;\n font-size: 1rem;\n}\n.main-module_dropdown__list__2bd_r > li {\n list-style: none;\n}\n.main-module_dropdown__list-head__2Uyb0 {\n padding: 0.5rem 0 0.5rem 1rem;\n}\n.main-module_dropdown__list_with-scroll__KP9yO {\n scrollbar-color: #79829c #ffffff;\n scrollbar-width: thin;\n max-height: 280px;\n overflow-y: auto;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar {\n width: 7px;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track {\n background-color: #ffffff;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track:hover {\n background-color: #f3f4f8;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb {\n background-color: #5c657e;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb:hover {\n background-color: #2d3748;\n}\n.main-module_dropdown__list-item__1u185 {\n display: block;\n padding: 0.5rem 1rem;\n cursor: default;\n}\n.main-module_dropdown__list-item__1u185:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_selected__2GYQr {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_disabled__1Psh7 {\n color: #abb4cd;\n}\n.main-module_dropdown__list-item_readonly__3bbj0 {\n color: #abb4cd;\n}\n.main-module_dropdown__search__1Moob {\n padding: 0.5rem 1rem 0.5rem;\n}\n.main-module_dropdown__header__kvhNn {\n margin: calc(1rem * 0.5) 1rem;\n}\n.main-module_dropdown__header-content__10Zg9 {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.main-module_dropdown__header-icon__30vfb {\n margin-right: 1rem;\n color: #abb4cd;\n font-size: 10px;\n font-size: 0.7142857142857143rem;\n}\n.main-module_dropdown__header-title__7NXxw {\n font-weight: 600;\n color: #5c657e;\n}\n.main-module_dropdown__error__1oS0H {\n display: flex;\n align-items: center;\n color: #e60c54;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_dropdown__error-icon__3OLzE {\n fill: #e60c54;\n}\n.main-module_dropdown__additional-info__1aTtM {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_select__1ocPo {\n position: relative;\n display: flex;\n flex: 0 2 auto;\n align-items: center;\n width: 100%;\n}\n.main-module_select__1ocPo::after {\n content: '';\n position: absolute;\n display: block;\n right: 0.715em;\n width: 7px;\n height: 7px;\n transform: translateY(-25%) rotate(-45deg);\n border-width: 0 0 1px 1px;\n border-style: solid;\n border-color: #3c83ec;\n}\n.main-module_select__1ocPo input {\n width: 100%;\n text-overflow: ellipsis;\n}\n.main-module_select__error__35ns4 {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 0.5rem 1rem;\n color: #e60c54;\n}\n.main-module_select__error-icon__1goaO {\n fill: #e60c54;\n}\n.main-module_dropdown-enter__2RGtd,\n.main-module_modal-enter__I5ELD {\n opacity: 0;\n transform: translate3d(0, -2rem, 0);\n}\n.main-module_mask-enter__32s5F {\n opacity: 0;\n}\n.main-module_dropdown-enter-active__ob1fb,\n.main-module_modal-enter-active__3BMYq {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n transition: transform 0.2s, opacity 0.2s;\n}\n.main-module_mask-enter-active__1WgVf {\n opacity: 1;\n transition: opacity 0.1s;\n}\n.main-module_dropdown-exit__3b2wX,\n.main-module_modal-exit__y2N_F {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n.main-module_mask-exit__325a4 {\n opacity: 1;\n}\n.main-module_dropdown-exit-active__22rth,\n.main-module_modal-exit-active__ID7ce {\n opacity: 0;\n transform: translate3d(0, -2rem, 0);\n transition: transform 0.2s, opacity 0.2s;\n}\n.main-module_mask-exit-active__2qs-r {\n opacity: 0;\n transition: opacity 0.1s;\n}\n";
|
|
8
|
+
var cssClasses = {"dropdown__content":"main-module_dropdown__content__X9kz_","dropdown__header":"main-module_dropdown__header__kvhNn","dropdown__header-title":"main-module_dropdown__header-title__7NXxw","dropdown":"main-module_dropdown__36KKf","dropdown__content_right":"main-module_dropdown__content_right__Rp4hR","dropdown__content_bottom":"main-module_dropdown__content_bottom__1OlNP","dropdown__item-with-hover":"main-module_dropdown__item-with-hover__3g-Za","dropdown__list":"main-module_dropdown__list__2bd_r","dropdown__list-head":"main-module_dropdown__list-head__2Uyb0","dropdown__list_with-scroll":"main-module_dropdown__list_with-scroll__KP9yO","dropdown__list-item":"main-module_dropdown__list-item__1u185","dropdown__list-item_selected":"main-module_dropdown__list-item_selected__2GYQr","dropdown__list-item_disabled":"main-module_dropdown__list-item_disabled__1Psh7","dropdown__list-item_readonly":"main-module_dropdown__list-item_readonly__3bbj0","dropdown__search":"main-module_dropdown__search__1Moob","dropdown__header-content":"main-module_dropdown__header-content__10Zg9","dropdown__header-icon":"main-module_dropdown__header-icon__30vfb","dropdown__error":"main-module_dropdown__error__1oS0H","dropdown__error-icon":"main-module_dropdown__error-icon__3OLzE","dropdown__additional-info":"main-module_dropdown__additional-info__1aTtM","select":"main-module_select__1ocPo","select__error":"main-module_select__error__35ns4","select__error-icon":"main-module_select__error-icon__1goaO","dropdown-enter":"main-module_dropdown-enter__2RGtd","modal-enter":"main-module_modal-enter__I5ELD","mask-enter":"main-module_mask-enter__32s5F","dropdown-enter-active":"main-module_dropdown-enter-active__ob1fb","modal-enter-active":"main-module_modal-enter-active__3BMYq","mask-enter-active":"main-module_mask-enter-active__1WgVf","dropdown-exit":"main-module_dropdown-exit__3b2wX","modal-exit":"main-module_modal-exit__y2N_F","mask-exit":"main-module_mask-exit__325a4","dropdown-exit-active":"main-module_dropdown-exit-active__22rth","modal-exit-active":"main-module_modal-exit-active__ID7ce","mask-exit-active":"main-module_mask-exit-active__2qs-r"};
|
|
9
9
|
styleInject_es['default'](css_248z);
|
|
10
10
|
|
|
11
11
|
exports.default = cssClasses;
|
|
@@ -18,14 +18,14 @@ import Select from '../../../dropdown/hoc/select/index.js';
|
|
|
18
18
|
* />
|
|
19
19
|
* )
|
|
20
20
|
*/
|
|
21
|
-
const ControlSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint, hintOptions = { isFixed: true }, placeholder, additionalInfo, onScroll, innerAdditionalContent }) => {
|
|
21
|
+
const ControlSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint, hintOptions = { isFixed: true }, placeholder, additionalInfo, onScroll, innerAdditionalContent, onSearch }) => {
|
|
22
22
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
23
23
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired },
|
|
24
24
|
label,
|
|
25
25
|
hint && React.createElement(Hint, { fixed: hintOptions.isFixed, spacingLeft: true, hint: hint }))),
|
|
26
26
|
React.createElement(Control.Content, null,
|
|
27
27
|
React.createElement(Control.Element, null,
|
|
28
|
-
React.createElement(Select, { key: name, name: name, options: options, defaultValues: defaultValues, isWithGroups: isWithGroups, isWithSearch: isWithSearch, defaultIsOpen: defaultIsOpen, defaultCloseOnClick: defaultCloseOnClick, isReadonly: isReadonly, isDisabled: isDisabled, placeholder: placeholder, onChange: onChange, onToggle: onToggle, onScroll: onScroll, innerAdditionalContent: innerAdditionalContent }))),
|
|
28
|
+
React.createElement(Select, { key: name, name: name, options: options, defaultValues: defaultValues, isWithGroups: isWithGroups, isWithSearch: isWithSearch, defaultIsOpen: defaultIsOpen, defaultCloseOnClick: defaultCloseOnClick, isReadonly: isReadonly, isDisabled: isDisabled, placeholder: placeholder, onChange: onChange, onToggle: onToggle, onScroll: onScroll, innerAdditionalContent: innerAdditionalContent, onSearch: onSearch }))),
|
|
29
29
|
React.createElement(Control.Errors, null),
|
|
30
30
|
additionalInfo && React.createElement(Control.AdditionalInfo, null, additionalInfo)));
|
|
31
31
|
};
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import React, { useRef, useState, useEffect } from 'react';
|
|
2
|
+
import debounce_1 from '../../../../../../../external/lodash/debounce.js';
|
|
2
3
|
import { DropdownContext } from '../../context/index.js';
|
|
3
4
|
import { cssDropdown } from '../../css_classes.js';
|
|
4
5
|
import cssClasses from '../../../../css/dropdown/main.module.less.js';
|
|
5
|
-
import {
|
|
6
|
+
import { isSelected, handleItemClick, handleSearchKeyUp } from '../../utilities.js';
|
|
6
7
|
import { useValue } from '../../hooks/use_value.js';
|
|
7
8
|
import { useToggle } from '../../hooks/use_toggle.js';
|
|
8
9
|
import { useSetOptionsOnClose } from '../../hooks/use_set_options_on_close.js';
|
|
@@ -75,7 +76,7 @@ onChange,
|
|
|
75
76
|
* Place where portal should be placed, by default to body
|
|
76
77
|
* this can be used to put modal inside modal
|
|
77
78
|
*/
|
|
78
|
-
portalContainer, placeholder, onScroll, innerAdditionalContent }) => {
|
|
79
|
+
portalContainer, placeholder, onScroll, innerAdditionalContent, onSearch }) => {
|
|
79
80
|
/**
|
|
80
81
|
* reference to dropdown wrapper element
|
|
81
82
|
*/
|
|
@@ -100,6 +101,10 @@ portalContainer, placeholder, onScroll, innerAdditionalContent }) => {
|
|
|
100
101
|
* hook which resets options list to default on close if select has search and it was used
|
|
101
102
|
*/
|
|
102
103
|
useSetOptionsOnClose(isWithSearch, isOpen, setOptionsList, options);
|
|
104
|
+
const handleSearch = debounce_1((ev) => {
|
|
105
|
+
onSearch && onSearch(ev);
|
|
106
|
+
handleSearchKeyUp(ev, options, setOptionsList);
|
|
107
|
+
}, 400);
|
|
103
108
|
useEffect(() => {
|
|
104
109
|
setOptionsList(options);
|
|
105
110
|
}, [options]);
|
|
@@ -107,7 +112,7 @@ portalContainer, placeholder, onScroll, innerAdditionalContent }) => {
|
|
|
107
112
|
React.createElement("div", { ref: wrapperRef, className: cssClasses[cssDropdown] },
|
|
108
113
|
React.createElement(Dropdown.Select, { name: name, isReadonly: isReadonly, isDisabled: isDisabled, selectedOptions: selectedValues, placeholder: placeholder, onRemoveOptions: setSelectedValues }),
|
|
109
114
|
React.createElement(Dropdown.Content, { portalContainer: portalContainer },
|
|
110
|
-
isWithSearch && React.createElement(Dropdown.Search, { onKeyUp: (ev) =>
|
|
115
|
+
isWithSearch && React.createElement(Dropdown.Search, { onKeyUp: (ev) => handleSearch(ev) }),
|
|
111
116
|
React.createElement(Dropdown.List, { isWithGroups: isWithGroups, onScroll: onScroll }, optionsList === null || optionsList === void 0 ? void 0 :
|
|
112
117
|
optionsList.map((option) => {
|
|
113
118
|
var _a, _b;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,uBAAuB,kDAAsD;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js
CHANGED
|
@@ -8,6 +8,7 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
8
8
|
const [errors, setErrors] = useState({});
|
|
9
9
|
const [isFetchingInitialData, setIsFetchingInitialData] = useState(true);
|
|
10
10
|
const [scrollTimer, setScrollTimer] = useState();
|
|
11
|
+
const [search, setSearch] = useState('');
|
|
11
12
|
const [t] = useTranslation();
|
|
12
13
|
const xhrSelectResponseParser = new XhrSelectResponseParser();
|
|
13
14
|
const loadDataOnScroll = (event) => {
|
|
@@ -29,14 +30,15 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
29
30
|
page: extraLoadedSelectorData.page,
|
|
30
31
|
list: [...selectorData.list, ...extraLoadedSelectorData.list]
|
|
31
32
|
};
|
|
32
|
-
|
|
33
|
+
setSelectorData(newSelectorData);
|
|
33
34
|
},
|
|
34
35
|
handleCatchErrors: () => {
|
|
35
36
|
setErrors({
|
|
36
37
|
...errors,
|
|
37
|
-
|
|
38
|
+
scrollError: t('Failed to load')
|
|
38
39
|
});
|
|
39
|
-
}
|
|
40
|
+
},
|
|
41
|
+
search
|
|
40
42
|
});
|
|
41
43
|
}, SCROLL_FETCH_TIMEOUT_IN_MS)));
|
|
42
44
|
};
|
|
@@ -48,6 +50,44 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
48
50
|
scrollError: ''
|
|
49
51
|
});
|
|
50
52
|
};
|
|
53
|
+
const loadDataOnSearch = (ev) => {
|
|
54
|
+
if ((selectorData === null || selectorData === void 0 ? void 0 : selectorData.page) === (selectorData === null || selectorData === void 0 ? void 0 : selectorData.pages))
|
|
55
|
+
return;
|
|
56
|
+
// to jest trochę nieczyste bo z jednej strony amamy search a z drugiej currentSearch i
|
|
57
|
+
// trzebaby to jakoś ładnie zrobić
|
|
58
|
+
const currentSearch = ev.target.value;
|
|
59
|
+
if (currentSearch === search)
|
|
60
|
+
return;
|
|
61
|
+
setSearch(currentSearch);
|
|
62
|
+
if (search === '') {
|
|
63
|
+
fetchXhrData({
|
|
64
|
+
url,
|
|
65
|
+
handleData: (selectorDataFromSearchResults) => {
|
|
66
|
+
setSelectorData(selectorDataFromSearchResults);
|
|
67
|
+
},
|
|
68
|
+
handleCatchErrors: () => {
|
|
69
|
+
setErrors({
|
|
70
|
+
...errors,
|
|
71
|
+
fetchError: t('Failed to load data. Please refresh the page and try again.')
|
|
72
|
+
});
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
fetchXhrData({
|
|
78
|
+
url,
|
|
79
|
+
handleData: (selectorDataFromSearchResults) => {
|
|
80
|
+
setSelectorData(selectorDataFromSearchResults);
|
|
81
|
+
},
|
|
82
|
+
handleCatchErrors: () => {
|
|
83
|
+
setErrors({
|
|
84
|
+
...errors,
|
|
85
|
+
scrollError: t('Failed to load')
|
|
86
|
+
});
|
|
87
|
+
},
|
|
88
|
+
search
|
|
89
|
+
});
|
|
90
|
+
};
|
|
51
91
|
useEffect(() => {
|
|
52
92
|
fetchXhrData({
|
|
53
93
|
url: `${url}?show-recent=1`,
|
|
@@ -67,9 +107,9 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
67
107
|
};
|
|
68
108
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
69
109
|
}, [url]);
|
|
70
|
-
const fetchXhrData = ({ url, handleData, handleCatchErrors }) => {
|
|
110
|
+
const fetchXhrData = ({ url, handleData, handleCatchErrors, search }) => {
|
|
71
111
|
fetchClient
|
|
72
|
-
.fetch({ method: 'get', url })
|
|
112
|
+
.fetch({ method: 'get', url: search ? `${url}?search=${search}` : url })
|
|
73
113
|
.then((selectorDataResponseDTO) => {
|
|
74
114
|
const selectorData = xhrSelectResponseParser.parse(selectorDataResponseDTO.data);
|
|
75
115
|
handleData(selectorData);
|
|
@@ -82,7 +122,8 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
|
|
|
82
122
|
selectorData,
|
|
83
123
|
errors,
|
|
84
124
|
isFetchingInitialData,
|
|
85
|
-
loadDataOnScroll
|
|
125
|
+
loadDataOnScroll,
|
|
126
|
+
loadDataOnSearch
|
|
86
127
|
};
|
|
87
128
|
};
|
|
88
129
|
|
package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,0EAA8E;AAC7G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,0EAA8E;AAC7G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -2,10 +2,11 @@
|
|
|
2
2
|
import { AxiosClient } from '@dreamcommerce/star_core';
|
|
3
3
|
import { TBaseHttpSelectorErrors } from '../types/xhr_select_types';
|
|
4
4
|
import { TBaseXhrSelectItemsWebapiList } from '../types/xhr_select_http_types';
|
|
5
|
-
export declare type
|
|
5
|
+
export declare type TFetchXhrSelectData = {
|
|
6
6
|
url: string;
|
|
7
7
|
handleData: (selectorData: TBaseXhrSelectItemsWebapiList) => void;
|
|
8
8
|
handleCatchErrors?: () => void;
|
|
9
|
+
search?: string;
|
|
9
10
|
};
|
|
10
11
|
export declare type TUseXhrSelectProps = {
|
|
11
12
|
url: string;
|
|
@@ -17,4 +18,5 @@ export declare type TUseXhrSelect = {
|
|
|
17
18
|
errors: TBaseHttpSelectorErrors;
|
|
18
19
|
isFetchingInitialData: boolean;
|
|
19
20
|
loadDataOnScroll: (event: React.UIEvent<HTMLElement>) => void;
|
|
21
|
+
loadDataOnSearch: (ev: React.KeyboardEvent<HTMLInputElement>) => void;
|
|
20
22
|
};
|
|
@@ -11,7 +11,7 @@ import { LATEST_HEADER_NAME } from './xhr_select_constants.js';
|
|
|
11
11
|
import { useXhrSelect } from './hooks/use_xhr_select.js';
|
|
12
12
|
|
|
13
13
|
const XhrSelect = ({ url, headerTitle, noItemsErrorMessage, onScroll, fetchClient = new AxiosClient(), ...props }) => {
|
|
14
|
-
const { selectorData, errors, isFetchingInitialData, loadDataOnScroll } = useXhrSelect({ url, fetchClient });
|
|
14
|
+
const { selectorData, errors, isFetchingInitialData, loadDataOnScroll, loadDataOnSearch } = useXhrSelect({ url, fetchClient });
|
|
15
15
|
const [t] = useTranslation();
|
|
16
16
|
const mapSelectorDataToSelectOptions = (selectorData) => {
|
|
17
17
|
const recentSelectorOptions = selectorData.recent
|
|
@@ -48,9 +48,9 @@ const XhrSelect = ({ url, headerTitle, noItemsErrorMessage, onScroll, fetchClien
|
|
|
48
48
|
"..."));
|
|
49
49
|
if (!(selectorData === null || selectorData === void 0 ? void 0 : selectorData.list.length))
|
|
50
50
|
return React.createElement(MessageBox, { type: "alert" }, noItemsErrorMessage);
|
|
51
|
-
return (React.createElement(ControlSelect, { ...props, isWithSearch: true, options: mapSelectorDataToSelectOptions(selectorData), onScroll: loadDataOnScroll, innerAdditionalContent: React.createElement(React.Fragment, null,
|
|
51
|
+
return (React.createElement(ControlSelect, { ...props, isWithSearch: true, options: mapSelectorDataToSelectOptions(selectorData), onScroll: loadDataOnScroll, onSearch: loadDataOnSearch, innerAdditionalContent: React.createElement(React.Fragment, null,
|
|
52
52
|
errors.scrollError && (React.createElement("div", { className: cssClasses[cssSelectError] },
|
|
53
|
-
React.createElement(IconWarning, { className: cssClasses[cssSelectErrorIcon] }),
|
|
53
|
+
React.createElement(IconWarning, { size: "m", className: cssClasses[cssSelectErrorIcon] }),
|
|
54
54
|
errors.scrollError)),
|
|
55
55
|
(selectorData === null || selectorData === void 0 ? void 0 : selectorData.page) !== (selectorData === null || selectorData === void 0 ? void 0 : selectorData.pages) && !errors.scrollError && (React.createElement(React.Fragment, null,
|
|
56
56
|
React.createElement(Loader, null),
|
|
@@ -59,10 +59,16 @@ const XhrSelect = ({ url, headerTitle, noItemsErrorMessage, onScroll, fetchClien
|
|
|
59
59
|
};
|
|
60
60
|
// X skąd wziąć abortującego fetcha?
|
|
61
61
|
// X cofanie requestów w useEffectie
|
|
62
|
-
// napisz ręcznie w storybooku xhr selecta
|
|
63
|
-
// popraw error message dla scrollErrora
|
|
62
|
+
// X napisz ręcznie w storybooku xhr selecta
|
|
63
|
+
// X popraw error message dla scrollErrora
|
|
64
64
|
// napisz testy jednostkowe
|
|
65
|
-
|
|
65
|
+
/////////////////////////////////////////
|
|
66
|
+
// dopisz obsługę searcha (debounce):
|
|
67
|
+
// jak wyszukujesz z xhr to wrzuć debounce z pół sekundy minimum
|
|
68
|
+
// jak skończysz wyszukiwać, to przywróć wcześniej zfetchowane wyniki,
|
|
69
|
+
// więc jeśli były zfetchowane 2 strony, to przywróć 2 strony już bez potrzeby fetchowania ten jeden dodatkowy raz
|
|
70
|
+
// kiedy usuniesz wyszukiwanie
|
|
71
|
+
////////////////////////////////////////////
|
|
66
72
|
// wyczyść kod
|
|
67
73
|
// handleData to średnia nazwa w fetchXhrdata
|
|
68
74
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,uEAA2E;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,uEAA2E;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -54,7 +54,7 @@ export interface IDropdownItemWithHover {
|
|
|
54
54
|
}) => void;
|
|
55
55
|
}
|
|
56
56
|
export interface IDropdownSearchProps {
|
|
57
|
-
onKeyUp: (ev: React.KeyboardEvent<
|
|
57
|
+
onKeyUp: (ev: React.KeyboardEvent<HTMLInputElement>) => void;
|
|
58
58
|
}
|
|
59
59
|
export interface IDropdownListProps {
|
|
60
60
|
isWithGroups?: boolean;
|
|
@@ -98,6 +98,7 @@ export interface ISelectProps extends IDropdownProps {
|
|
|
98
98
|
innerAdditionalContent?: React.ReactNode;
|
|
99
99
|
onChange?: (selectedOption: ISelectOption) => void;
|
|
100
100
|
onScroll?: (event: React.UIEvent<HTMLElement>) => void;
|
|
101
|
+
onSearch?: (ev: React.KeyboardEvent<HTMLInputElement>) => void;
|
|
101
102
|
}
|
|
102
103
|
export interface ISelectOption {
|
|
103
104
|
text: string;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n@media (max-width: 576px) {\n .main-module_dropdown__content__X9kz_ {\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n .main-module_dropdown__header__kvhNn {\n display: block;\n }\n .main-module_dropdown__header-title__7NXxw {\n margin-left: 0.5rem;\n }\n}\n@media (min-width: 576px) {\n .main-module_dropdown__header__kvhNn {\n display: none;\n }\n}\n.main-module_dropdown__36KKf {\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.main-module_dropdown__content__X9kz_ {\n flex: 0 0 auto;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 1200;\n width: auto;\n padding: 0.5rem 0;\n background-color: #ffffff;\n border-radius: 3px;\n box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.2);\n}\n.main-module_dropdown__content__X9kz_::before {\n content: '';\n display: block;\n position: absolute;\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-style: solid;\n border-color: transparent transparent #ffffff transparent;\n}\n.main-module_dropdown__content_right__Rp4hR::before {\n right: 7px;\n left: auto;\n}\n.main-module_dropdown__content_bottom__1OlNP::before {\n top: auto;\n bottom: -14px;\n border-color: #ffffff transparent transparent transparent;\n}\n.main-module_dropdown__item-with-hover__3g-Za {\n pointer-events: all;\n}\n.main-module_dropdown__item-with-hover__3g-Za:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list__2bd_r {\n flex: 0 0 auto;\n padding: 0;\n width: 100%;\n min-width: 20rem;\n text-align: left;\n font-size: 14px;\n font-size: 1rem;\n}\n.main-module_dropdown__list__2bd_r > li {\n list-style: none;\n}\n.main-module_dropdown__list-head__2Uyb0 {\n padding: 0.5rem 0 0.5rem 1rem;\n}\n.main-module_dropdown__list_with-scroll__KP9yO {\n scrollbar-color: #79829c #ffffff;\n scrollbar-width: thin;\n max-height: 280px;\n overflow-y: auto;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar {\n width: 7px;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track {\n background-color: #ffffff;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track:hover {\n background-color: #f3f4f8;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb {\n background-color: #5c657e;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb:hover {\n background-color: #2d3748;\n}\n.main-module_dropdown__list-item__1u185 {\n display: block;\n padding: 0.5rem 1rem;\n cursor: default;\n}\n.main-module_dropdown__list-item__1u185:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_selected__2GYQr {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_disabled__1Psh7 {\n color: #abb4cd;\n}\n.main-module_dropdown__list-item_readonly__3bbj0 {\n color: #abb4cd;\n}\n.main-module_dropdown__search__1Moob {\n padding: 0.5rem 1rem 0.5rem;\n}\n.main-module_dropdown__header__kvhNn {\n margin: calc(1rem * 0.5) 1rem;\n}\n.main-module_dropdown__header-content__10Zg9 {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.main-module_dropdown__header-icon__30vfb {\n margin-right: 1rem;\n color: #abb4cd;\n font-size: 10px;\n font-size: 0.7142857142857143rem;\n}\n.main-module_dropdown__header-title__7NXxw {\n font-weight: 600;\n color: #5c657e;\n}\n.main-module_dropdown__error__1oS0H {\n display: flex;\n align-items: center;\n color: #e60c54;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_dropdown__error-icon__3OLzE {\n fill: #e60c54;\n}\n.main-module_dropdown__additional-info__1aTtM {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_select__1ocPo {\n position: relative;\n display: flex;\n flex: 0 2 auto;\n align-items: center;\n width: 100%;\n}\n.main-module_select__1ocPo::after {\n content: '';\n position: absolute;\n display: block;\n right: 0.715em;\n width: 7px;\n height: 7px;\n transform: translateY(-25%) rotate(-45deg);\n border-width: 0 0 1px 1px;\n border-style: solid;\n border-color: #3c83ec;\n}\n.main-module_select__1ocPo input {\n width: 100%;\n text-overflow: ellipsis;\n}\n.main-module_select__error__35ns4 {\n color:
|
|
4
|
-
var cssClasses = {"dropdown__content":"main-module_dropdown__content__X9kz_","dropdown__header":"main-module_dropdown__header__kvhNn","dropdown__header-title":"main-module_dropdown__header-title__7NXxw","dropdown":"main-module_dropdown__36KKf","dropdown__content_right":"main-module_dropdown__content_right__Rp4hR","dropdown__content_bottom":"main-module_dropdown__content_bottom__1OlNP","dropdown__item-with-hover":"main-module_dropdown__item-with-hover__3g-Za","dropdown__list":"main-module_dropdown__list__2bd_r","dropdown__list-head":"main-module_dropdown__list-head__2Uyb0","dropdown__list_with-scroll":"main-module_dropdown__list_with-scroll__KP9yO","dropdown__list-item":"main-module_dropdown__list-item__1u185","dropdown__list-item_selected":"main-module_dropdown__list-item_selected__2GYQr","dropdown__list-item_disabled":"main-module_dropdown__list-item_disabled__1Psh7","dropdown__list-item_readonly":"main-module_dropdown__list-item_readonly__3bbj0","dropdown__search":"main-module_dropdown__search__1Moob","dropdown__header-content":"main-module_dropdown__header-content__10Zg9","dropdown__header-icon":"main-module_dropdown__header-icon__30vfb","dropdown__error":"main-module_dropdown__error__1oS0H","dropdown__error-icon":"main-module_dropdown__error-icon__3OLzE","dropdown__additional-info":"main-module_dropdown__additional-info__1aTtM","select":"main-module_select__1ocPo","select__error":"main-module_select__error__35ns4","dropdown-enter":"main-module_dropdown-enter__2RGtd","modal-enter":"main-module_modal-enter__I5ELD","mask-enter":"main-module_mask-enter__32s5F","dropdown-enter-active":"main-module_dropdown-enter-active__ob1fb","modal-enter-active":"main-module_modal-enter-active__3BMYq","mask-enter-active":"main-module_mask-enter-active__1WgVf","dropdown-exit":"main-module_dropdown-exit__3b2wX","modal-exit":"main-module_modal-exit__y2N_F","mask-exit":"main-module_mask-exit__325a4","dropdown-exit-active":"main-module_dropdown-exit-active__22rth","modal-exit-active":"main-module_modal-exit-active__ID7ce","mask-exit-active":"main-module_mask-exit-active__2qs-r"};
|
|
3
|
+
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n@media (max-width: 576px) {\n .main-module_dropdown__content__X9kz_ {\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n .main-module_dropdown__header__kvhNn {\n display: block;\n }\n .main-module_dropdown__header-title__7NXxw {\n margin-left: 0.5rem;\n }\n}\n@media (min-width: 576px) {\n .main-module_dropdown__header__kvhNn {\n display: none;\n }\n}\n.main-module_dropdown__36KKf {\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.main-module_dropdown__content__X9kz_ {\n flex: 0 0 auto;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 1200;\n width: auto;\n padding: 0.5rem 0;\n background-color: #ffffff;\n border-radius: 3px;\n box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.2);\n}\n.main-module_dropdown__content__X9kz_::before {\n content: '';\n display: block;\n position: absolute;\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-style: solid;\n border-color: transparent transparent #ffffff transparent;\n}\n.main-module_dropdown__content_right__Rp4hR::before {\n right: 7px;\n left: auto;\n}\n.main-module_dropdown__content_bottom__1OlNP::before {\n top: auto;\n bottom: -14px;\n border-color: #ffffff transparent transparent transparent;\n}\n.main-module_dropdown__item-with-hover__3g-Za {\n pointer-events: all;\n}\n.main-module_dropdown__item-with-hover__3g-Za:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list__2bd_r {\n flex: 0 0 auto;\n padding: 0;\n width: 100%;\n min-width: 20rem;\n text-align: left;\n font-size: 14px;\n font-size: 1rem;\n}\n.main-module_dropdown__list__2bd_r > li {\n list-style: none;\n}\n.main-module_dropdown__list-head__2Uyb0 {\n padding: 0.5rem 0 0.5rem 1rem;\n}\n.main-module_dropdown__list_with-scroll__KP9yO {\n scrollbar-color: #79829c #ffffff;\n scrollbar-width: thin;\n max-height: 280px;\n overflow-y: auto;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar {\n width: 7px;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track {\n background-color: #ffffff;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track:hover {\n background-color: #f3f4f8;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb {\n background-color: #5c657e;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb:hover {\n background-color: #2d3748;\n}\n.main-module_dropdown__list-item__1u185 {\n display: block;\n padding: 0.5rem 1rem;\n cursor: default;\n}\n.main-module_dropdown__list-item__1u185:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_selected__2GYQr {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_disabled__1Psh7 {\n color: #abb4cd;\n}\n.main-module_dropdown__list-item_readonly__3bbj0 {\n color: #abb4cd;\n}\n.main-module_dropdown__search__1Moob {\n padding: 0.5rem 1rem 0.5rem;\n}\n.main-module_dropdown__header__kvhNn {\n margin: calc(1rem * 0.5) 1rem;\n}\n.main-module_dropdown__header-content__10Zg9 {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.main-module_dropdown__header-icon__30vfb {\n margin-right: 1rem;\n color: #abb4cd;\n font-size: 10px;\n font-size: 0.7142857142857143rem;\n}\n.main-module_dropdown__header-title__7NXxw {\n font-weight: 600;\n color: #5c657e;\n}\n.main-module_dropdown__error__1oS0H {\n display: flex;\n align-items: center;\n color: #e60c54;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_dropdown__error-icon__3OLzE {\n fill: #e60c54;\n}\n.main-module_dropdown__additional-info__1aTtM {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_select__1ocPo {\n position: relative;\n display: flex;\n flex: 0 2 auto;\n align-items: center;\n width: 100%;\n}\n.main-module_select__1ocPo::after {\n content: '';\n position: absolute;\n display: block;\n right: 0.715em;\n width: 7px;\n height: 7px;\n transform: translateY(-25%) rotate(-45deg);\n border-width: 0 0 1px 1px;\n border-style: solid;\n border-color: #3c83ec;\n}\n.main-module_select__1ocPo input {\n width: 100%;\n text-overflow: ellipsis;\n}\n.main-module_select__error__35ns4 {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 0.5rem 1rem;\n color: #e60c54;\n}\n.main-module_select__error-icon__1goaO {\n fill: #e60c54;\n}\n.main-module_dropdown-enter__2RGtd,\n.main-module_modal-enter__I5ELD {\n opacity: 0;\n transform: translate3d(0, -2rem, 0);\n}\n.main-module_mask-enter__32s5F {\n opacity: 0;\n}\n.main-module_dropdown-enter-active__ob1fb,\n.main-module_modal-enter-active__3BMYq {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n transition: transform 0.2s, opacity 0.2s;\n}\n.main-module_mask-enter-active__1WgVf {\n opacity: 1;\n transition: opacity 0.1s;\n}\n.main-module_dropdown-exit__3b2wX,\n.main-module_modal-exit__y2N_F {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n.main-module_mask-exit__325a4 {\n opacity: 1;\n}\n.main-module_dropdown-exit-active__22rth,\n.main-module_modal-exit-active__ID7ce {\n opacity: 0;\n transform: translate3d(0, -2rem, 0);\n transition: transform 0.2s, opacity 0.2s;\n}\n.main-module_mask-exit-active__2qs-r {\n opacity: 0;\n transition: opacity 0.1s;\n}\n";
|
|
4
|
+
var cssClasses = {"dropdown__content":"main-module_dropdown__content__X9kz_","dropdown__header":"main-module_dropdown__header__kvhNn","dropdown__header-title":"main-module_dropdown__header-title__7NXxw","dropdown":"main-module_dropdown__36KKf","dropdown__content_right":"main-module_dropdown__content_right__Rp4hR","dropdown__content_bottom":"main-module_dropdown__content_bottom__1OlNP","dropdown__item-with-hover":"main-module_dropdown__item-with-hover__3g-Za","dropdown__list":"main-module_dropdown__list__2bd_r","dropdown__list-head":"main-module_dropdown__list-head__2Uyb0","dropdown__list_with-scroll":"main-module_dropdown__list_with-scroll__KP9yO","dropdown__list-item":"main-module_dropdown__list-item__1u185","dropdown__list-item_selected":"main-module_dropdown__list-item_selected__2GYQr","dropdown__list-item_disabled":"main-module_dropdown__list-item_disabled__1Psh7","dropdown__list-item_readonly":"main-module_dropdown__list-item_readonly__3bbj0","dropdown__search":"main-module_dropdown__search__1Moob","dropdown__header-content":"main-module_dropdown__header-content__10Zg9","dropdown__header-icon":"main-module_dropdown__header-icon__30vfb","dropdown__error":"main-module_dropdown__error__1oS0H","dropdown__error-icon":"main-module_dropdown__error-icon__3OLzE","dropdown__additional-info":"main-module_dropdown__additional-info__1aTtM","select":"main-module_select__1ocPo","select__error":"main-module_select__error__35ns4","select__error-icon":"main-module_select__error-icon__1goaO","dropdown-enter":"main-module_dropdown-enter__2RGtd","modal-enter":"main-module_modal-enter__I5ELD","mask-enter":"main-module_mask-enter__32s5F","dropdown-enter-active":"main-module_dropdown-enter-active__ob1fb","modal-enter-active":"main-module_modal-enter-active__3BMYq","mask-enter-active":"main-module_mask-enter-active__1WgVf","dropdown-exit":"main-module_dropdown-exit__3b2wX","modal-exit":"main-module_modal-exit__y2N_F","mask-exit":"main-module_mask-exit__325a4","dropdown-exit-active":"main-module_dropdown-exit-active__22rth","modal-exit-active":"main-module_modal-exit-active__ID7ce","mask-exit-active":"main-module_mask-exit-active__2qs-r"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export default cssClasses;
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@dreamcommerce/aurora",
|
|
3
3
|
"packageManager": "yarn@3.2.0",
|
|
4
4
|
"sideEffects": false,
|
|
5
|
-
"version": "2.1.10-
|
|
5
|
+
"version": "2.1.10-8",
|
|
6
6
|
"description": "aurora",
|
|
7
7
|
"author": "k0ssak",
|
|
8
8
|
"license": "MIT",
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"storybook-package": "start-storybook -p 6006 package",
|
|
36
36
|
"build-storybook": "build-storybook",
|
|
37
37
|
"jest:visual": "jest -c .config/jest/jest.config.visual.js --detectOpenHandles",
|
|
38
|
-
"tests:unit": "jest -c .config/jest/jest.config.unit.js",
|
|
38
|
+
"tests:unit": "jest -c .config/jest/jest.config.unit.js -- xhr_select",
|
|
39
39
|
"watch:tests:unit": "jest --watch -c .config/jest/jest.config.unit.js",
|
|
40
40
|
"tests:structural": "jest -c .config/jest/jest.config.structural.js",
|
|
41
41
|
"tests:visual": "start-server-and-test storybook http-get://localhost:6006 jest:visual",
|