@hh.ru/magritte-ui-select 9.0.9 → 9.0.11

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 (9) hide show
  1. package/SelectBottomSheet.js +1 -1
  2. package/SelectDrop.js +1 -1
  3. package/SelectEmptyHint.js +1 -1
  4. package/SelectError.js +1 -1
  5. package/SelectOption.js +1 -1
  6. package/index.css +21 -21
  7. package/package.json +4 -4
  8. package/useSelectState.js +9 -10
  9. package/useSelectState.js.map +1 -1
package/SelectBottomSheet.js CHANGED
@@ -24,7 +24,7 @@ import '@hh.ru/magritte-ui-typography';
24
24
  import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
25
25
  import '@hh.ru/magritte-ui-checkbox-radio';
26
26
 
27
- var styles = {"select-bottom-sheet":"magritte-select-bottom-sheet___1RZDJ_9-0-9","selectBottomSheet":"magritte-select-bottom-sheet___1RZDJ_9-0-9","select-bottom-sheet_checkbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-9","selectBottomSheetCheckbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-9","select-bottom-sheet_radio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-9","selectBottomSheetRadio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-9","full-screen-placeholder":"magritte-full-screen-placeholder___zPC8k_9-0-9","fullScreenPlaceholder":"magritte-full-screen-placeholder___zPC8k_9-0-9","error-wrapper":"magritte-error-wrapper___P7jYg_9-0-9","errorWrapper":"magritte-error-wrapper___P7jYg_9-0-9"};
27
+ var styles = {"select-bottom-sheet":"magritte-select-bottom-sheet___1RZDJ_9-0-11","selectBottomSheet":"magritte-select-bottom-sheet___1RZDJ_9-0-11","select-bottom-sheet_checkbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-11","selectBottomSheetCheckbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-11","select-bottom-sheet_radio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-11","selectBottomSheetRadio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-11","full-screen-placeholder":"magritte-full-screen-placeholder___zPC8k_9-0-11","fullScreenPlaceholder":"magritte-full-screen-placeholder___zPC8k_9-0-11","error-wrapper":"magritte-error-wrapper___P7jYg_9-0-11","errorWrapper":"magritte-error-wrapper___P7jYg_9-0-11"};
28
28
 
29
29
  const SelectOptionDefault = ({ data, input, type, }) => {
30
30
  if (type === 'delimiter') {
package/SelectDrop.js CHANGED
@@ -19,7 +19,7 @@ import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
19
19
  import '@hh.ru/magritte-ui-checkbox-radio';
20
20
  import '@hh.ru/magritte-ui-icon/icon';
21
21
 
22
- var styles = {"select-drop":"magritte-select-drop___jn4O-_9-0-9","selectDrop":"magritte-select-drop___jn4O-_9-0-9","select-drop-header":"magritte-select-drop-header___fMmio_9-0-9","selectDropHeader":"magritte-select-drop-header___fMmio_9-0-9","select-drop_plain":"magritte-select-drop_plain___VL8Fz_9-0-9","selectDropPlain":"magritte-select-drop_plain___VL8Fz_9-0-9","label-option-plain":"magritte-label-option-plain___BvBH8_9-0-9","labelOptionPlain":"magritte-label-option-plain___BvBH8_9-0-9","loading":"magritte-loading___AMiuq_9-0-9","hint":"magritte-hint___6qaFl_9-0-9"};
22
+ var styles = {"select-drop":"magritte-select-drop___jn4O-_9-0-11","selectDrop":"magritte-select-drop___jn4O-_9-0-11","select-drop-header":"magritte-select-drop-header___fMmio_9-0-11","selectDropHeader":"magritte-select-drop-header___fMmio_9-0-11","select-drop_plain":"magritte-select-drop_plain___VL8Fz_9-0-11","selectDropPlain":"magritte-select-drop_plain___VL8Fz_9-0-11","label-option-plain":"magritte-label-option-plain___BvBH8_9-0-11","labelOptionPlain":"magritte-label-option-plain___BvBH8_9-0-11","loading":"magritte-loading___AMiuq_9-0-11","hint":"magritte-hint___6qaFl_9-0-11"};
23
23
 
24
24
  const SelectOptionDefault = ({ data, input, type, plain, }) => {
25
25
  if (type === 'delimiter') {
package/SelectEmptyHint.js CHANGED
@@ -6,7 +6,7 @@ import { VSpacing } from '@hh.ru/magritte-ui-spacing';
6
6
  import { Title } from '@hh.ru/magritte-ui-title';
7
7
  import { Text } from '@hh.ru/magritte-ui-typography';
8
8
 
9
- var styles = {"select-empty-hint":"magritte-select-empty-hint___B39XJ_9-0-9","selectEmptyHint":"magritte-select-empty-hint___B39XJ_9-0-9","icon":"magritte-icon___F0GQx_9-0-9","icon-init":"magritte-icon-init___GWK-V_9-0-9","iconInit":"magritte-icon-init___GWK-V_9-0-9","icon-search":"magritte-icon-search___ZsqO-_9-0-9","iconSearch":"magritte-icon-search___ZsqO-_9-0-9"};
9
+ var styles = {"select-empty-hint":"magritte-select-empty-hint___B39XJ_9-0-11","selectEmptyHint":"magritte-select-empty-hint___B39XJ_9-0-11","icon":"magritte-icon___F0GQx_9-0-11","icon-init":"magritte-icon-init___GWK-V_9-0-11","iconInit":"magritte-icon-init___GWK-V_9-0-11","icon-search":"magritte-icon-search___ZsqO-_9-0-11","iconSearch":"magritte-icon-search___ZsqO-_9-0-11"};
10
10
 
11
11
  const SelectEmptyHint = ({ title, titleElement, description, type }) => {
12
12
  return (jsxs("div", { className: styles.selectEmptyHint, children: [type === 'init' && (jsx("div", { className: classnames(styles.icon, styles.iconInit), children: jsx(MagnifierOutlinedSize24, {}) })), type === 'emptySearch' && (jsx("div", { className: classnames(styles.icon, styles.iconSearch), children: jsx(EmojiHalfsadOutlinedSize24, {}) })), jsx(VSpacing, { default: 32 }), jsx(Title, { Element: titleElement, size: "small", children: title }), jsx(VSpacing, { default: 8 }), Boolean(description) && (jsx(Text, { typography: "paragraph-2-regular", style: "secondary", children: description }))] }));
package/SelectError.js CHANGED
@@ -7,7 +7,7 @@ import { VSpacing } from '@hh.ru/magritte-ui-spacing';
7
7
  import { Title } from '@hh.ru/magritte-ui-title';
8
8
  import { Text } from '@hh.ru/magritte-ui-typography';
9
9
 
10
- var styles = {"error-container":"magritte-error-container___t9B5w_9-0-9","errorContainer":"magritte-error-container___t9B5w_9-0-9"};
10
+ var styles = {"error-container":"magritte-error-container___t9B5w_9-0-11","errorContainer":"magritte-error-container___t9B5w_9-0-11"};
11
11
 
12
12
  const SelectError = ({ innerErrorTrls, reload, }) => {
13
13
  const { isMobile } = useBreakpoint();
package/SelectOption.js CHANGED
@@ -9,7 +9,7 @@ import { Radio, Checkbox } from '@hh.ru/magritte-ui-checkbox-radio';
9
9
  import { CheckOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
10
10
  import { Text } from '@hh.ru/magritte-ui-typography';
11
11
 
12
- var styles = {"select-option-label":"magritte-select-option-label___bYo2l_9-0-9","selectOptionLabel":"magritte-select-option-label___bYo2l_9-0-9","select-option-label_desktop":"magritte-select-option-label_desktop___bceen_9-0-9","selectOptionLabelDesktop":"magritte-select-option-label_desktop___bceen_9-0-9","select-delimiter":"magritte-select-delimiter___WyeR6_9-0-9","selectDelimiter":"magritte-select-delimiter___WyeR6_9-0-9"};
12
+ var styles = {"select-option-label":"magritte-select-option-label___bYo2l_9-0-11","selectOptionLabel":"magritte-select-option-label___bYo2l_9-0-11","select-option-label_desktop":"magritte-select-option-label_desktop___bceen_9-0-11","selectOptionLabelDesktop":"magritte-select-option-label_desktop___bceen_9-0-11","select-delimiter":"magritte-select-delimiter___WyeR6_9-0-11","selectDelimiter":"magritte-select-delimiter___WyeR6_9-0-11"};
13
13
 
14
14
  const CheckableComponent = ({ type, value, checked, name, onChange, 'data-qa': dataQa, }) => {
15
15
  if (type === 'label') {
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- .magritte-error-container___t9B5w_9-0-9{
1
+ .magritte-error-container___t9B5w_9-0-11{
2
2
  display:flex;
3
3
  flex-direction:column;
4
4
  align-items:center;
@@ -6,26 +6,26 @@
6
6
  justify-content:center;
7
7
  }
8
8
  @media (min-width: 1020px){
9
- body.magritte-old-layout .magritte-error-container___t9B5w_9-0-9{
9
+ body.magritte-old-layout .magritte-error-container___t9B5w_9-0-11{
10
10
  min-height:320px;
11
11
  height:auto;
12
12
  }
13
13
  }
14
14
  @media (min-width: 1024px){
15
- body:not(.magritte-old-layout) .magritte-error-container___t9B5w_9-0-9{
15
+ body:not(.magritte-old-layout) .magritte-error-container___t9B5w_9-0-11{
16
16
  min-height:320px;
17
17
  height:auto;
18
18
  }
19
19
  }
20
20
 
21
- .magritte-select-option-label___bYo2l_9-0-9{
21
+ .magritte-select-option-label___bYo2l_9-0-11{
22
22
  display:flex;
23
23
  max-height:56px;
24
24
  }
25
- .magritte-select-option-label_desktop___bceen_9-0-9{
25
+ .magritte-select-option-label_desktop___bceen_9-0-11{
26
26
  max-height:24px;
27
27
  }
28
- .magritte-select-delimiter___WyeR6_9-0-9{
28
+ .magritte-select-delimiter___WyeR6_9-0-11{
29
29
  padding-left:16px;
30
30
  padding-top:12px;
31
31
  }
@@ -33,51 +33,51 @@
33
33
  :root{
34
34
  --magritte-static-space-400-v21-1-0:16px;
35
35
  }
36
- .magritte-select-bottom-sheet___1RZDJ_9-0-9{
36
+ .magritte-select-bottom-sheet___1RZDJ_9-0-11{
37
37
  display:flex;
38
38
  flex-direction:column;
39
39
  padding:0 var(--magritte-static-space-400-v21-1-0);
40
40
  padding-bottom:16px;
41
41
  }
42
- .magritte-select-bottom-sheet_checkbox___hwTgo_9-0-9,
43
- .magritte-select-bottom-sheet_radio___qvFFV_9-0-9{
42
+ .magritte-select-bottom-sheet_checkbox___hwTgo_9-0-11,
43
+ .magritte-select-bottom-sheet_radio___qvFFV_9-0-11{
44
44
  gap:12px;
45
45
  }
46
- .magritte-full-screen-placeholder___zPC8k_9-0-9{
46
+ .magritte-full-screen-placeholder___zPC8k_9-0-11{
47
47
  display:flex;
48
48
  flex-direction:column;
49
49
  align-items:center;
50
50
  height:100%;
51
51
  justify-content:center;
52
52
  }
53
- .magritte-error-wrapper___P7jYg_9-0-9{
53
+ .magritte-error-wrapper___P7jYg_9-0-11{
54
54
  height:100%;
55
55
  }
56
56
 
57
- .magritte-select-drop___jn4O-_9-0-9{
57
+ .magritte-select-drop___jn4O-_9-0-11{
58
58
  display:flex;
59
59
  flex-direction:column;
60
60
  gap:8px;
61
61
  }
62
- .magritte-select-drop-header___fMmio_9-0-9{
62
+ .magritte-select-drop-header___fMmio_9-0-11{
63
63
  display:flex;
64
64
  flex-direction:column;
65
65
  margin-bottom:8px;
66
66
  }
67
- .magritte-select-drop_plain___VL8Fz_9-0-9{
67
+ .magritte-select-drop_plain___VL8Fz_9-0-11{
68
68
  gap:16px;
69
69
  }
70
- .magritte-label-option-plain___BvBH8_9-0-9{
70
+ .magritte-label-option-plain___BvBH8_9-0-11{
71
71
  display:flex;
72
72
  justify-content:center;
73
73
  }
74
- .magritte-loading___AMiuq_9-0-9{
74
+ .magritte-loading___AMiuq_9-0-11{
75
75
  display:flex;
76
76
  align-items:center;
77
77
  height:150px;
78
78
  justify-content:center;
79
79
  }
80
- .magritte-hint___6qaFl_9-0-9{
80
+ .magritte-hint___6qaFl_9-0-11{
81
81
  display:flex;
82
82
  flex-direction:column;
83
83
  align-items:center;
@@ -97,14 +97,14 @@
97
97
  --magritte-color-icon-tertiary-v21-1-0:#767676;
98
98
  --magritte-color-icon-accent-v21-1-0:#5e9eff;
99
99
  }
100
- .magritte-select-empty-hint___B39XJ_9-0-9{
100
+ .magritte-select-empty-hint___B39XJ_9-0-11{
101
101
  display:flex;
102
102
  flex-direction:column;
103
103
  justify-content:center;
104
104
  align-content:center;
105
105
  align-items:center;
106
106
  }
107
- .magritte-icon___F0GQx_9-0-9{
107
+ .magritte-icon___F0GQx_9-0-11{
108
108
  display:flex;
109
109
  align-items:center;
110
110
  justify-content:center;
@@ -112,11 +112,11 @@
112
112
  height:48px;
113
113
  border-radius:50%;
114
114
  }
115
- .magritte-icon-init___GWK-V_9-0-9{
115
+ .magritte-icon-init___GWK-V_9-0-11{
116
116
  background-color:var(--magritte-color-background-accent-secondary-v21-1-0);
117
117
  --magritte-ui-icon-color-override:var(--magritte-color-icon-accent-v21-1-0);
118
118
  }
119
- .magritte-icon-search___ZsqO-_9-0-9{
119
+ .magritte-icon-search___ZsqO-_9-0-11{
120
120
  background-color:var(--magritte-color-background-secondary-v21-1-0);
121
121
  --magritte-ui-icon-color-override:var(--magritte-color-icon-tertiary-v21-1-0);
122
122
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-select",
3
- "version": "9.0.9",
3
+ "version": "9.0.11",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -32,8 +32,8 @@
32
32
  "@hh.ru/magritte-common-keyboard": "4.1.0",
33
33
  "@hh.ru/magritte-common-use-multiple-refs": "1.1.5",
34
34
  "@hh.ru/magritte-ui-action": "4.4.25",
35
- "@hh.ru/magritte-ui-action-bar": "2.2.19",
36
- "@hh.ru/magritte-ui-bottom-sheet": "5.5.39",
35
+ "@hh.ru/magritte-ui-action-bar": "2.2.20",
36
+ "@hh.ru/magritte-ui-bottom-sheet": "5.5.40",
37
37
  "@hh.ru/magritte-ui-breakpoint": "5.0.0",
38
38
  "@hh.ru/magritte-ui-button": "5.2.18",
39
39
  "@hh.ru/magritte-ui-button-stack": "2.1.37",
@@ -50,5 +50,5 @@
50
50
  "@hh.ru/magritte-ui-trigger": "3.0.20",
51
51
  "@hh.ru/magritte-ui-typography": "3.0.27"
52
52
  },
53
- "gitHead": "90bc8ed24a1f6efc2a0a8a937245c482166b9c60"
53
+ "gitHead": "97c190cff43cfbf208af71a33794d031673ccf4f"
54
54
  }
package/useSelectState.js CHANGED
@@ -36,14 +36,14 @@ const useSelectState = (multiple, value, showOptions, hasChangesButton, onChange
36
36
  onChangeExternalHandlerRef.current = onChangeExternalHandler;
37
37
  const onSelectOptionRef = useRef(onSelectOption);
38
38
  onSelectOptionRef.current = onSelectOption;
39
- const updateSelectedValuesAndLabels = useCallback((values, needEmitChangeEvent = true) => {
39
+ const updateSelectedValues = useCallback((values, needEmitChangeEvent = true) => {
40
40
  if (needEmitChangeEvent) {
41
41
  const hasUnsavedChanges = !isArraysEquals(prevValues.current.map((item) => item.value), values.map((item) => item.value));
42
42
  if (hasUnsavedChanges) {
43
43
  onChangeExternalHandlerRef.current?.((multiple ? values : values[0]));
44
- prevValues.current = values;
45
44
  }
46
45
  }
46
+ prevValues.current = values;
47
47
  }, [multiple]);
48
48
  useEffect(() => {
49
49
  if (showOptions) {
@@ -59,17 +59,17 @@ const useSelectState = (multiple, value, showOptions, hasChangesButton, onChange
59
59
  }
60
60
  // если values и редьюсер разошлись
61
61
  dispatch({ type: SET, payload: newValues });
62
- updateSelectedValuesAndLabels(newValues);
63
- }, [updateSelectedValuesAndLabels, value]);
62
+ updateSelectedValues(newValues, false);
63
+ }, [updateSelectedValues, value]);
64
64
  return {
65
65
  values: (multiple ? state : state[0]),
66
66
  clearSelectedValues: () => {
67
67
  dispatch({ type: CLEAR });
68
- updateSelectedValuesAndLabels([]);
68
+ updateSelectedValues([]);
69
69
  },
70
70
  setInitialValues: () => {
71
71
  dispatch({ type: SET, payload: initialValuesOnMount.current });
72
- updateSelectedValuesAndLabels(initialValuesOnMount.current);
72
+ updateSelectedValues(initialValuesOnMount.current);
73
73
  },
74
74
  setInitialValuesWithoutOnChange: () => {
75
75
  // в остальных кейсах селект обновляется сразу
@@ -84,7 +84,6 @@ const useSelectState = (multiple, value, showOptions, hasChangesButton, onChange
84
84
  // даже если не нажимали кнопку применить
85
85
  if (hasInitialValuesAndPrevEmittedValusAreEqual) {
86
86
  dispatch({ type: SET, payload: initialValuesOnOpening.current });
87
- updateSelectedValuesAndLabels(initialValuesOnOpening.current, false);
88
87
  }
89
88
  },
90
89
  onChange: useCallback((value, needToPut) => {
@@ -102,11 +101,11 @@ const useSelectState = (multiple, value, showOptions, hasChangesButton, onChange
102
101
  dispatch({ type: actionType, payload: newValue });
103
102
  onSelectOptionRef.current?.(newValue);
104
103
  if (!hasChangesButton) {
105
- updateSelectedValuesAndLabels(newValue);
104
+ updateSelectedValues(newValue);
106
105
  }
107
- }, [hasChangesButton, multiple, state, updateSelectedValuesAndLabels]),
106
+ }, [hasChangesButton, multiple, state, updateSelectedValues]),
108
107
  setSelectedValues: () => {
109
- updateSelectedValuesAndLabels(state);
108
+ updateSelectedValues(state);
110
109
  },
111
110
  initialValuesOnOpening,
112
111
  };
package/useSelectState.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useSelectState.js","sources":["../src/useSelectState.ts"],"sourcesContent":["import { useCallback, useReducer, useEffect, useRef } from 'react';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { isArraysEquals } from '@hh.ru/magritte-ui-select/isArraysEquals';\nimport { UseSelectState } from '@hh.ru/magritte-ui-select/types';\n\nconst ADD = 'ADD';\nconst SET = 'SET';\nconst REMOVE = 'REMOVE';\nconst SINGLE_CHOICE = 'SINGLE_CHOICE';\nconst CLEAR = 'CLEAR';\n\nconst reducer = <DataType extends StaticDataFetcherItem>(\n state: DataType[],\n {\n type,\n payload,\n }:\n | { type: typeof ADD | typeof REMOVE | typeof SINGLE_CHOICE; payload: DataType[] }\n | { type: typeof CLEAR; payload?: DataType }\n | { type: typeof SET; payload: DataType[] }\n) => {\n switch (type) {\n case ADD:\n return payload;\n case SET:\n return [...payload];\n case REMOVE:\n return payload;\n case CLEAR:\n return [];\n case SINGLE_CHOICE:\n return payload;\n default:\n return state;\n }\n};\n\nexport const useSelectState = <\n DataType extends StaticDataFetcherItem,\n MultipleType extends boolean,\n ValueType = [MultipleType] extends [true] ? DataType[] : DataType,\n>(\n multiple: boolean,\n value: DataType[] | DataType,\n showOptions: boolean,\n hasChangesButton?: boolean,\n onChangeExternalHandler?: (value: ValueType) => void,\n onSelectOption?: (values: DataType[]) => void\n): UseSelectState<MultipleType, DataType, ValueType> => {\n const valuesArr = Array.isArray(value) ? value : [value];\n const prevValues = useRef(valuesArr);\n const initialValuesOnMount = useRef(valuesArr);\n const initialValuesOnOpening = useRef<DataType[]>([]);\n const [state, dispatch] = useReducer(reducer<DataType>, valuesArr);\n const stateRef = useRef(state);\n stateRef.current = state;\n\n // используем ref, чтобы не вызывать пересчетов функции внутри хука из-за стрелочных колбэков\n const onChangeExternalHandlerRef = useRef(onChangeExternalHandler);\n onChangeExternalHandlerRef.current = onChangeExternalHandler;\n const onSelectOptionRef = useRef(onSelectOption);\n onSelectOptionRef.current = onSelectOption;\n\n const updateSelectedValuesAndLabels = useCallback(\n (values: DataType[], needEmitChangeEvent = true) => {\n if (needEmitChangeEvent) {\n const hasUnsavedChanges = !isArraysEquals<string>(\n prevValues.current.map((item) => item.value),\n values.map((item) => item.value)\n );\n if (hasUnsavedChanges) {\n onChangeExternalHandlerRef.current?.((multiple ? values : values[0]) as ValueType);\n prevValues.current = values;\n }\n }\n },\n [multiple]\n );\n\n useEffect(() => {\n if (showOptions) {\n initialValuesOnOpening.current = state;\n }\n // сохраняем values при открытии select\n // eslint-disable-next-line disable-autofix/react-hooks/exhaustive-deps\n }, [showOptions]);\n\n useEffect(() => {\n const newValues = Array.isArray(value) ? value : [value];\n if (isArraysEquals(newValues, stateRef.current)) {\n return;\n }\n // если values и редьюсер разошлись\n dispatch({ type: SET, payload: newValues });\n updateSelectedValuesAndLabels(newValues);\n }, [updateSelectedValuesAndLabels, value]);\n\n return {\n values: (multiple ? state : state[0]) as ValueType,\n clearSelectedValues: () => {\n dispatch({ type: CLEAR });\n updateSelectedValuesAndLabels([]);\n },\n setInitialValues: () => {\n dispatch({ type: SET, payload: initialValuesOnMount.current });\n updateSelectedValuesAndLabels(initialValuesOnMount.current);\n },\n setInitialValuesWithoutOnChange: () => {\n // в остальных кейсах селект обновляется сразу\n // либо выбранные значения сразу применяются\n if (!hasChangesButton) {\n return;\n }\n const hasInitialValuesAndPrevEmittedValusAreEqual = isArraysEquals<string>(\n initialValuesOnOpening.current.map((item) => item.value),\n prevValues.current.map((item) => item.value)\n );\n // если values после открытия не поменялись\n // то надо скоректировать состояния в drop/bottom-sheet\n // иначе в drop/bottom-sheet будут те же элементы что и при предыдущем открытии\n // даже если не нажимали кнопку применить\n if (hasInitialValuesAndPrevEmittedValusAreEqual) {\n dispatch({ type: SET, payload: initialValuesOnOpening.current });\n updateSelectedValuesAndLabels(initialValuesOnOpening.current, false);\n }\n },\n onChange: useCallback(\n (value, needToPut) => {\n const multipleActionType = needToPut ? ADD : REMOVE;\n const actionType = multiple ? multipleActionType : SINGLE_CHOICE;\n // single\n let newValue = [value];\n // multiple\n if (actionType === ADD) {\n newValue = [...state, value];\n }\n if (actionType === REMOVE) {\n newValue = state.filter((item) => item.value !== value.value);\n }\n dispatch({ type: actionType, payload: newValue });\n onSelectOptionRef.current?.(newValue);\n if (!hasChangesButton) {\n updateSelectedValuesAndLabels(newValue);\n }\n },\n [hasChangesButton, multiple, state, updateSelectedValuesAndLabels]\n ),\n setSelectedValues: () => {\n updateSelectedValuesAndLabels(state);\n },\n initialValuesOnOpening,\n };\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useSelectState.js","sources":["../src/useSelectState.ts"],"sourcesContent":["import { useCallback, useReducer, useEffect, useRef } from 'react';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { isArraysEquals } from '@hh.ru/magritte-ui-select/isArraysEquals';\nimport { UseSelectState } from '@hh.ru/magritte-ui-select/types';\n\nconst ADD = 'ADD';\nconst SET = 'SET';\nconst REMOVE = 'REMOVE';\nconst SINGLE_CHOICE = 'SINGLE_CHOICE';\nconst CLEAR = 'CLEAR';\n\nconst reducer = <DataType extends StaticDataFetcherItem>(\n state: DataType[],\n {\n type,\n payload,\n }:\n | { type: typeof ADD | typeof REMOVE | typeof SINGLE_CHOICE; payload: DataType[] }\n | { type: typeof CLEAR; payload?: DataType }\n | { type: typeof SET; payload: DataType[] }\n) => {\n switch (type) {\n case ADD:\n return payload;\n case SET:\n return [...payload];\n case REMOVE:\n return payload;\n case CLEAR:\n return [];\n case SINGLE_CHOICE:\n return payload;\n default:\n return state;\n }\n};\n\nexport const useSelectState = <\n DataType extends StaticDataFetcherItem,\n MultipleType extends boolean,\n ValueType = [MultipleType] extends [true] ? DataType[] : DataType,\n>(\n multiple: boolean,\n value: DataType[] | DataType,\n showOptions: boolean,\n hasChangesButton?: boolean,\n onChangeExternalHandler?: (value: ValueType) => void,\n onSelectOption?: (values: DataType[]) => void\n): UseSelectState<MultipleType, DataType, ValueType> => {\n const valuesArr = Array.isArray(value) ? value : [value];\n const prevValues = useRef(valuesArr);\n const initialValuesOnMount = useRef(valuesArr);\n const initialValuesOnOpening = useRef<DataType[]>([]);\n const [state, dispatch] = useReducer(reducer<DataType>, valuesArr);\n const stateRef = useRef(state);\n stateRef.current = state;\n\n // используем ref, чтобы не вызывать пересчетов функции внутри хука из-за стрелочных колбэков\n const onChangeExternalHandlerRef = useRef(onChangeExternalHandler);\n onChangeExternalHandlerRef.current = onChangeExternalHandler;\n const onSelectOptionRef = useRef(onSelectOption);\n onSelectOptionRef.current = onSelectOption;\n\n const updateSelectedValues = useCallback(\n (values: DataType[], needEmitChangeEvent = true) => {\n if (needEmitChangeEvent) {\n const hasUnsavedChanges = !isArraysEquals<string>(\n prevValues.current.map((item) => item.value),\n values.map((item) => item.value)\n );\n if (hasUnsavedChanges) {\n onChangeExternalHandlerRef.current?.((multiple ? values : values[0]) as ValueType);\n }\n }\n prevValues.current = values;\n },\n [multiple]\n );\n\n useEffect(() => {\n if (showOptions) {\n initialValuesOnOpening.current = state;\n }\n // сохраняем values при открытии select\n // eslint-disable-next-line disable-autofix/react-hooks/exhaustive-deps\n }, [showOptions]);\n\n useEffect(() => {\n const newValues = Array.isArray(value) ? value : [value];\n if (isArraysEquals(newValues, stateRef.current)) {\n return;\n }\n // если values и редьюсер разошлись\n dispatch({ type: SET, payload: newValues });\n updateSelectedValues(newValues, false);\n }, [updateSelectedValues, value]);\n\n return {\n values: (multiple ? state : state[0]) as ValueType,\n clearSelectedValues: () => {\n dispatch({ type: CLEAR });\n updateSelectedValues([]);\n },\n setInitialValues: () => {\n dispatch({ type: SET, payload: initialValuesOnMount.current });\n updateSelectedValues(initialValuesOnMount.current);\n },\n setInitialValuesWithoutOnChange: () => {\n // в остальных кейсах селект обновляется сразу\n // либо выбранные значения сразу применяются\n if (!hasChangesButton) {\n return;\n }\n const hasInitialValuesAndPrevEmittedValusAreEqual = isArraysEquals<string>(\n initialValuesOnOpening.current.map((item) => item.value),\n prevValues.current.map((item) => item.value)\n );\n // если values после открытия не поменялись\n // то надо скоректировать состояния в drop/bottom-sheet\n // иначе в drop/bottom-sheet будут те же элементы что и при предыдущем открытии\n // даже если не нажимали кнопку применить\n if (hasInitialValuesAndPrevEmittedValusAreEqual) {\n dispatch({ type: SET, payload: initialValuesOnOpening.current });\n }\n },\n onChange: useCallback(\n (value, needToPut) => {\n const multipleActionType = needToPut ? ADD : REMOVE;\n const actionType = multiple ? multipleActionType : SINGLE_CHOICE;\n // single\n let newValue = [value];\n // multiple\n if (actionType === ADD) {\n newValue = [...state, value];\n }\n if (actionType === REMOVE) {\n newValue = state.filter((item) => item.value !== value.value);\n }\n dispatch({ type: actionType, payload: newValue });\n onSelectOptionRef.current?.(newValue);\n if (!hasChangesButton) {\n updateSelectedValues(newValue);\n }\n },\n [hasChangesButton, multiple, state, updateSelectedValues]\n ),\n setSelectedValues: () => {\n updateSelectedValues(state);\n },\n initialValuesOnOpening,\n };\n};\n"],"names":[],"mappings":";;;AAMA,MAAM,GAAG,GAAG,KAAK,CAAC;AAClB,MAAM,GAAG,GAAG,KAAK,CAAC;AAClB,MAAM,MAAM,GAAG,QAAQ,CAAC;AACxB,MAAM,aAAa,GAAG,eAAe,CAAC;AACtC,MAAM,KAAK,GAAG,OAAO,CAAC;AAEtB,MAAM,OAAO,GAAG,CACZ,KAAiB,EACjB,EACI,IAAI,EACJ,OAAO,GAIoC,KAC/C;IACA,QAAQ,IAAI;AACR,QAAA,KAAK,GAAG;AACJ,YAAA,OAAO,OAAO,CAAC;AACnB,QAAA,KAAK,GAAG;AACJ,YAAA,OAAO,CAAC,GAAG,OAAO,CAAC,CAAC;AACxB,QAAA,KAAK,MAAM;AACP,YAAA,OAAO,OAAO,CAAC;AACnB,QAAA,KAAK,KAAK;AACN,YAAA,OAAO,EAAE,CAAC;AACd,QAAA,KAAK,aAAa;AACd,YAAA,OAAO,OAAO,CAAC;AACnB,QAAA;AACI,YAAA,OAAO,KAAK,CAAC;KACpB;AACL,CAAC,CAAC;AAEW,MAAA,cAAc,GAAG,CAK1B,QAAiB,EACjB,KAA4B,EAC5B,WAAoB,EACpB,gBAA0B,EAC1B,uBAAoD,EACpD,cAA6C,KACM;AACnD,IAAA,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC;AACzD,IAAA,MAAM,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC;AACrC,IAAA,MAAM,oBAAoB,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC;AAC/C,IAAA,MAAM,sBAAsB,GAAG,MAAM,CAAa,EAAE,CAAC,CAAC;AACtD,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,UAAU,EAAC,OAAiB,GAAE,SAAS,CAAC,CAAC;AACnE,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;AAC/B,IAAA,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC;;AAGzB,IAAA,MAAM,0BAA0B,GAAG,MAAM,CAAC,uBAAuB,CAAC,CAAC;AACnE,IAAA,0BAA0B,CAAC,OAAO,GAAG,uBAAuB,CAAC;AAC7D,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;AACjD,IAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc,CAAC;IAE3C,MAAM,oBAAoB,GAAG,WAAW,CACpC,CAAC,MAAkB,EAAE,mBAAmB,GAAG,IAAI,KAAI;QAC/C,IAAI,mBAAmB,EAAE;AACrB,YAAA,MAAM,iBAAiB,GAAG,CAAC,cAAc,CACrC,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,EAC5C,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,CACnC,CAAC;YACF,IAAI,iBAAiB,EAAE;AACnB,gBAAA,0BAA0B,CAAC,OAAO,IAAI,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,EAAe,CAAC;aACtF;SACJ;AACD,QAAA,UAAU,CAAC,OAAO,GAAG,MAAM,CAAC;AAChC,KAAC,EACD,CAAC,QAAQ,CAAC,CACb,CAAC;IAEF,SAAS,CAAC,MAAK;QACX,IAAI,WAAW,EAAE;AACb,YAAA,sBAAsB,CAAC,OAAO,GAAG,KAAK,CAAC;SAC1C;;;AAGL,KAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,SAAS,CAAC,MAAK;AACX,QAAA,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC;QACzD,IAAI,cAAc,CAAC,SAAS,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE;YAC7C,OAAO;SACV;;QAED,QAAQ,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC;AAC5C,QAAA,oBAAoB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;AAC3C,KAAC,EAAE,CAAC,oBAAoB,EAAE,KAAK,CAAC,CAAC,CAAC;IAElC,OAAO;AACH,QAAA,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,CAAc;QAClD,mBAAmB,EAAE,MAAK;AACtB,YAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;YAC1B,oBAAoB,CAAC,EAAE,CAAC,CAAC;SAC5B;QACD,gBAAgB,EAAE,MAAK;AACnB,YAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,oBAAoB,CAAC,OAAO,EAAE,CAAC,CAAC;AAC/D,YAAA,oBAAoB,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC;SACtD;QACD,+BAA+B,EAAE,MAAK;;;YAGlC,IAAI,CAAC,gBAAgB,EAAE;gBACnB,OAAO;aACV;AACD,YAAA,MAAM,2CAA2C,GAAG,cAAc,CAC9D,sBAAsB,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,EACxD,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,CAC/C,CAAC;;;;;YAKF,IAAI,2CAA2C,EAAE;AAC7C,gBAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,sBAAsB,CAAC,OAAO,EAAE,CAAC,CAAC;aACpE;SACJ;QACD,QAAQ,EAAE,WAAW,CACjB,CAAC,KAAK,EAAE,SAAS,KAAI;YACjB,MAAM,kBAAkB,GAAG,SAAS,GAAG,GAAG,GAAG,MAAM,CAAC;YACpD,MAAM,UAAU,GAAG,QAAQ,GAAG,kBAAkB,GAAG,aAAa,CAAC;;AAEjE,YAAA,IAAI,QAAQ,GAAG,CAAC,KAAK,CAAC,CAAC;;AAEvB,YAAA,IAAI,UAAU,KAAK,GAAG,EAAE;AACpB,gBAAA,QAAQ,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,CAAC,CAAC;aAChC;AACD,YAAA,IAAI,UAAU,KAAK,MAAM,EAAE;AACvB,gBAAA,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,CAAC,CAAC;aACjE;YACD,QAAQ,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC;AAClD,YAAA,iBAAiB,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACtC,IAAI,CAAC,gBAAgB,EAAE;gBACnB,oBAAoB,CAAC,QAAQ,CAAC,CAAC;aAClC;SACJ,EACD,CAAC,gBAAgB,EAAE,QAAQ,EAAE,KAAK,EAAE,oBAAoB,CAAC,CAC5D;QACD,iBAAiB,EAAE,MAAK;YACpB,oBAAoB,CAAC,KAAK,CAAC,CAAC;SAC/B;QACD,sBAAsB;KACzB,CAAC;AACN;;;;"}