@dreamcommerce/aurora 2.1.10-7 → 2.1.10-9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/build/cjs/packages/aurora/src/components/controls/hoc/control_select/index.js +2 -2
  2. package/build/cjs/packages/aurora/src/components/dropdown/hoc/select/index.js +7 -2
  3. package/build/cjs/packages/aurora/src/components/dropdown/hoc/select/index.js.map +1 -1
  4. package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js +44 -16
  5. package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js.map +1 -1
  6. package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js +12 -6
  7. package/build/cjs/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js.map +1 -1
  8. package/build/cjs/packages/aurora/src/css/dropdown/main.module.less.js +2 -2
  9. package/build/esm/packages/aurora/src/components/controls/hoc/control_select/index.js +2 -2
  10. package/build/esm/packages/aurora/src/components/dropdown/hoc/select/index.js +8 -3
  11. package/build/esm/packages/aurora/src/components/dropdown/hoc/select/index.js.map +1 -1
  12. package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js +45 -17
  13. package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select.js.map +1 -1
  14. package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/hooks/use_xhr_select_types.d.ts +2 -1
  15. package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js +12 -6
  16. package/build/esm/packages/aurora/src/components/dropdown/hoc/xhr_select/xhr_select.js.map +1 -1
  17. package/build/esm/packages/aurora/src/components/dropdown/types.d.ts +2 -1
  18. package/build/esm/packages/aurora/src/css/dropdown/main.module.less.js +2 -2
  19. 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) => utilities.handleSearchKeyUp(ev, options, setOptionsList) }),
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;"}
@@ -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) => {
@@ -26,14 +27,14 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
26
27
  }
27
28
  setScrollTimer(Number(setTimeout(() => {
28
29
  fetchXhrData({
29
- url: `${url}?page=${selectorData.page + 1}`,
30
+ url: `${url}?page=${selectorData.page + 1}&search=${search}`,
30
31
  handleData: (extraLoadedSelectorData) => {
31
32
  const newSelectorData = {
32
33
  ...selectorData,
33
34
  page: extraLoadedSelectorData.page,
34
35
  list: [...selectorData.list, ...extraLoadedSelectorData.list]
35
36
  };
36
- throw new Error();
37
+ setSelectorData(newSelectorData);
37
38
  },
38
39
  handleCatchErrors: () => {
39
40
  setErrors({
@@ -52,26 +53,31 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
52
53
  scrollError: ''
53
54
  });
54
55
  };
55
- React.useEffect(() => {
56
+ const loadDataOnSearch = (ev) => {
57
+ // to jest trochę nieczyste bo z jednej strony amamy search a z drugiej currentSearch i
58
+ // trzebaby to jakoś ładnie zrobić
59
+ const currentSearch = ev.target.value;
60
+ if (currentSearch === search)
61
+ return;
62
+ setSearch(currentSearch);
63
+ if (currentSearch === '') {
64
+ fetchInitialData();
65
+ return;
66
+ }
56
67
  fetchXhrData({
57
- url: `${url}?show-recent=1`,
58
- handleData: (initialSelectorData) => {
59
- setSelectorData(initialSelectorData);
60
- setIsFetchingInitialData(false);
68
+ url: `${url}?search=${currentSearch}`,
69
+ handleData: (selectorDataFromSearchResults) => {
70
+ setSelectorData(selectorDataFromSearchResults);
61
71
  },
62
72
  handleCatchErrors: () => {
63
73
  setErrors({
64
74
  ...errors,
65
- fetchError: t('Failed to load data. Please refresh the page and try again.')
75
+ scrollError: t('Failed to load')
66
76
  });
67
77
  }
68
78
  });
69
- return () => {
70
- fetchClient.makeCancelable().cancelRequest();
71
- };
72
- // eslint-disable-next-line react-hooks/exhaustive-deps
73
- }, [url]);
74
- const fetchXhrData = ({ url, handleData, handleCatchErrors }) => {
79
+ };
80
+ const fetchXhrData = React.useCallback(({ url, handleData, handleCatchErrors }) => {
75
81
  fetchClient
76
82
  .fetch({ method: 'get', url })
77
83
  .then((selectorDataResponseDTO) => {
@@ -81,12 +87,34 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
81
87
  .catch(() => {
82
88
  handleCatchErrors && handleCatchErrors();
83
89
  });
84
- };
90
+ }, [fetchClient, xhrSelectResponseParser]);
91
+ const fetchInitialData = React.useCallback(() => {
92
+ fetchXhrData({
93
+ url: `${url}?show-recent=1`,
94
+ handleData: (initialSelectorData) => {
95
+ setSelectorData(initialSelectorData);
96
+ setIsFetchingInitialData(false);
97
+ },
98
+ handleCatchErrors: () => {
99
+ setErrors({
100
+ ...errors,
101
+ fetchError: t('Failed to load data. Please refresh the page and try again.')
102
+ });
103
+ }
104
+ });
105
+ }, [errors, fetchXhrData, url, t]);
106
+ React.useEffect(() => {
107
+ fetchInitialData();
108
+ return () => {
109
+ fetchClient.makeCancelable().cancelRequest();
110
+ };
111
+ }, [fetchClient, fetchInitialData]);
85
112
  return {
86
113
  selectorData,
87
114
  errors,
88
115
  isFetchingInitialData,
89
- loadDataOnScroll
116
+ loadDataOnScroll,
117
+ loadDataOnSearch
90
118
  };
91
119
  };
92
120
 
@@ -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;"}
@@ -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
- // dopisz obsługę searcha (debounce)
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: red;\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","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 { handleSearchKeyUp, isSelected, handleItemClick } from '../../utilities.js';
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) => handleSearchKeyUp(ev, options, setOptionsList) }),
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;"}
@@ -1,4 +1,4 @@
1
- import { useState, useEffect } from 'react';
1
+ import { useState, useCallback, useEffect } from 'react';
2
2
  import { useTranslation } from '../../../../../../../../external/react-i18next/dist/es/useTranslation.js';
3
3
  import { SCROLL_FETCH_TIMEOUT_IN_MS } from '../xhr_select_constants.js';
4
4
  import { XhrSelectResponseParser } from '../xhr_select_response_parser.js';
@@ -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) => {
@@ -22,14 +23,14 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
22
23
  }
23
24
  setScrollTimer(Number(setTimeout(() => {
24
25
  fetchXhrData({
25
- url: `${url}?page=${selectorData.page + 1}`,
26
+ url: `${url}?page=${selectorData.page + 1}&search=${search}`,
26
27
  handleData: (extraLoadedSelectorData) => {
27
28
  const newSelectorData = {
28
29
  ...selectorData,
29
30
  page: extraLoadedSelectorData.page,
30
31
  list: [...selectorData.list, ...extraLoadedSelectorData.list]
31
32
  };
32
- throw new Error();
33
+ setSelectorData(newSelectorData);
33
34
  },
34
35
  handleCatchErrors: () => {
35
36
  setErrors({
@@ -48,26 +49,31 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
48
49
  scrollError: ''
49
50
  });
50
51
  };
51
- useEffect(() => {
52
+ const loadDataOnSearch = (ev) => {
53
+ // to jest trochę nieczyste bo z jednej strony amamy search a z drugiej currentSearch i
54
+ // trzebaby to jakoś ładnie zrobić
55
+ const currentSearch = ev.target.value;
56
+ if (currentSearch === search)
57
+ return;
58
+ setSearch(currentSearch);
59
+ if (currentSearch === '') {
60
+ fetchInitialData();
61
+ return;
62
+ }
52
63
  fetchXhrData({
53
- url: `${url}?show-recent=1`,
54
- handleData: (initialSelectorData) => {
55
- setSelectorData(initialSelectorData);
56
- setIsFetchingInitialData(false);
64
+ url: `${url}?search=${currentSearch}`,
65
+ handleData: (selectorDataFromSearchResults) => {
66
+ setSelectorData(selectorDataFromSearchResults);
57
67
  },
58
68
  handleCatchErrors: () => {
59
69
  setErrors({
60
70
  ...errors,
61
- fetchError: t('Failed to load data. Please refresh the page and try again.')
71
+ scrollError: t('Failed to load')
62
72
  });
63
73
  }
64
74
  });
65
- return () => {
66
- fetchClient.makeCancelable().cancelRequest();
67
- };
68
- // eslint-disable-next-line react-hooks/exhaustive-deps
69
- }, [url]);
70
- const fetchXhrData = ({ url, handleData, handleCatchErrors }) => {
75
+ };
76
+ const fetchXhrData = useCallback(({ url, handleData, handleCatchErrors }) => {
71
77
  fetchClient
72
78
  .fetch({ method: 'get', url })
73
79
  .then((selectorDataResponseDTO) => {
@@ -77,12 +83,34 @@ const useXhrSelect = ({ url, fetchClient, onScroll }) => {
77
83
  .catch(() => {
78
84
  handleCatchErrors && handleCatchErrors();
79
85
  });
80
- };
86
+ }, [fetchClient, xhrSelectResponseParser]);
87
+ const fetchInitialData = useCallback(() => {
88
+ fetchXhrData({
89
+ url: `${url}?show-recent=1`,
90
+ handleData: (initialSelectorData) => {
91
+ setSelectorData(initialSelectorData);
92
+ setIsFetchingInitialData(false);
93
+ },
94
+ handleCatchErrors: () => {
95
+ setErrors({
96
+ ...errors,
97
+ fetchError: t('Failed to load data. Please refresh the page and try again.')
98
+ });
99
+ }
100
+ });
101
+ }, [errors, fetchXhrData, url, t]);
102
+ useEffect(() => {
103
+ fetchInitialData();
104
+ return () => {
105
+ fetchClient.makeCancelable().cancelRequest();
106
+ };
107
+ }, [fetchClient, fetchInitialData]);
81
108
  return {
82
109
  selectorData,
83
110
  errors,
84
111
  isFetchingInitialData,
85
- loadDataOnScroll
112
+ loadDataOnScroll,
113
+ loadDataOnSearch
86
114
  };
87
115
  };
88
116
 
@@ -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;"}
@@ -2,7 +2,7 @@
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 TFetchXhrData = {
5
+ export declare type TFetchXhrSelectData = {
6
6
  url: string;
7
7
  handleData: (selectorData: TBaseXhrSelectItemsWebapiList) => void;
8
8
  handleCatchErrors?: () => void;
@@ -17,4 +17,5 @@ export declare type TUseXhrSelect = {
17
17
  errors: TBaseHttpSelectorErrors;
18
18
  isFetchingInitialData: boolean;
19
19
  loadDataOnScroll: (event: React.UIEvent<HTMLElement>) => void;
20
+ loadDataOnSearch: (ev: React.KeyboardEvent<HTMLInputElement>) => void;
20
21
  };
@@ -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
- // dopisz obsługę searcha (debounce)
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<Element>) => void;
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: red;\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","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-7",
5
+ "version": "2.1.10-9",
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",