@danikokonn/yarik-frontend-lib 2.0.58-test1 → 2.0.58-test11

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 (3) hide show
  1. package/dist/components/RichFilterTextField/RichFilterTextField.d.ts.map +1 -1
  2. package/dist/components/RichFilterTextField/RichFilterTextField.js +47 -36
  3. package/package.json +1 -1
package/dist/components/RichFilterTextField/RichFilterTextField.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RichFilterTextField.d.ts","sourceRoot":"","sources":["../../../src/components/RichFilterTextField/RichFilterTextField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAUf,OAAO,wBAAwB,MAAM,4BAA4B,CAAC;AAMlE,QAAA,MAAM,mBAAmB,GAAI,4HAS1B,wBAAwB,sBAiP1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1
+ {"version":3,"file":"RichFilterTextField.d.ts","sourceRoot":"","sources":["../../../src/components/RichFilterTextField/RichFilterTextField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAUf,OAAO,wBAAwB,MAAM,4BAA4B,CAAC;AAKlE,QAAA,MAAM,mBAAmB,GAAI,4HAS1B,wBAAwB,sBAqQ1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
package/dist/components/RichFilterTextField/RichFilterTextField.js CHANGED
@@ -7,38 +7,44 @@ import SearchRoundedIcon from "@mui/icons-material/SearchRounded";
7
7
  import HintOptionsMenu from "./HintOptionsMenu";
8
8
  import { getHints, insertInStrPos } from "./utils";
9
9
  import { useSnackbarContext } from "../../providers";
10
- import { useDebounce } from "../../utils";
11
10
  import FilterHistoryMenu from "./FilterHistoryMenu";
12
11
  import { Stack } from "@mui/material";
13
12
  const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, additionalComponents, instant: _instant, onChange, onSelectFromHistory, }) => {
14
13
  const { enqueueSnackbar } = useSnackbarContext();
15
14
  const [search, setSearch] = useState(filterExpr);
16
15
  const instant = _instant ?? true;
17
- useEffect(() => setSearch(filterExpr), [filterExpr]);
18
16
  const [searchHist, setSearchHist] = useState(filterExprHist);
19
- const [inputAnchor, setInputAnchor] = useState(null);
20
- const [cursorPos, setCursorPos] = useState(null);
21
- const [currentHintOptions, setCurrentHintOptions] = useState(() => new Map());
17
+ // const [inputAnchor, setInputAnchor] = useState<HTMLDivElement | null>(null);
18
+ const [hintMenuOpen, setHintMenuOpen] = useState(false);
19
+ // const [cursorPos, setCursorPos] = useState<number | null>(null);
20
+ // const [currentHintOptions, setCurrentHintOptions] = useState<
21
+ // Map<string, string | undefined>
22
+ // >(() => new Map());
22
23
  const [focusIdx, setFocusIdx] = useState(0);
23
24
  const inputRef = useRef(null);
24
25
  const textFieldRef = useRef(null);
25
- const updateHints = useDebounce(() => {
26
- if (cursorPos == null)
27
- return;
28
- const hints = getHints(search, cursorPos, fields, operators);
29
- setCurrentHintOptions(hints);
30
- setFocusIdx(0);
31
- setInputAnchor(hints?.size > 0 ? textFieldRef.current : null);
32
- }, 20);
26
+ const cursorPos = inputRef.current?.selectionStart;
27
+ const currentHintOptions = (cursorPos != null && hintMenuOpen
28
+ ? getHints(search, cursorPos, fields, operators)
29
+ : null) ?? new Map();
30
+ const inputAnchor = currentHintOptions?.size > 0 && hintMenuOpen ? textFieldRef.current : null;
33
31
  useEffect(() => {
34
32
  if (cursorPos == null)
35
33
  return;
36
- if (inputRef.current && cursorPos !== inputRef.current.selectionStart) {
37
- inputRef.current.selectionStart = cursorPos;
38
- inputRef.current.selectionEnd = cursorPos;
39
- }
40
- updateHints();
41
- }, [cursorPos, search]);
34
+ if (currentHintOptions === getHints(search, cursorPos, fields, operators))
35
+ return;
36
+ setFocusIdx(0);
37
+ // setInputAnchor(currentHintOptions?.size > 0 ? textFieldRef.current : null);
38
+ }, [search, cursorPos]);
39
+ // useEffect(() => {
40
+ // if (cursorPos == null) return;
41
+ // if (inputRef.current && cursorPos !== inputRef.current.selectionStart) {
42
+ // inputRef.current.selectionStart = cursorPos;
43
+ // inputRef.current.selectionEnd = cursorPos;
44
+ // }
45
+ // }, [cursorPos]);
46
+ // Принудительное изменение состояния, если изменился пропс
47
+ // useEffect(() => setSearch(filterExpr), [filterExpr]);
42
48
  const handleChange = (value, _idx) => {
43
49
  setSearch(value);
44
50
  onChange(value, (v) => setSearchHist(v));
@@ -57,12 +63,11 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
57
63
  }
58
64
  const { newSearch, newPos } = insertInStrPos(search, cursorPos, hint, fields);
59
65
  handleChange(newSearch);
60
- if (hint.includes("[") || hint.includes("(") || hint.includes("/")) {
61
- setCursorPos(newPos - 1);
62
- }
63
- else {
64
- setCursorPos(newPos);
65
- }
66
+ // if (hint.includes("[") || hint.includes("(") || hint.includes("/")) {
67
+ // setCursorPos(newPos - 1);
68
+ // } else {
69
+ // setCursorPos(newPos);
70
+ // }
66
71
  };
67
72
  const handleKeyUp = (e) => {
68
73
  switch (e.code) {
@@ -87,12 +92,14 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
87
92
  }
88
93
  case "Escape":
89
94
  case "Tab": {
90
- setInputAnchor(null);
91
- setCursorPos(null);
95
+ // setInputAnchor(null);
96
+ // setCursorPos(null);
97
+ setHintMenuOpen(false);
92
98
  break;
93
99
  }
94
100
  default: {
95
- setCursorPos(inputRef.current?.selectionStart ?? null);
101
+ // setCursorPos(inputRef.current?.selectionStart ?? null);
102
+ setHintMenuOpen(true);
96
103
  }
97
104
  }
98
105
  };
@@ -102,8 +109,8 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
102
109
  case "ArrowRight":
103
110
  case "Space":
104
111
  case "Backspace": {
105
- setInputAnchor(null);
106
- setCursorPos(inputRef.current?.selectionStart ?? null);
112
+ // setCursorPos(inputRef.current?.selectionStart ?? null);
113
+ setHintMenuOpen(true);
107
114
  return;
108
115
  }
109
116
  case "ArrowDown": {
@@ -136,12 +143,14 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
136
143
  }
137
144
  case "Escape":
138
145
  case "Tab": {
139
- setInputAnchor(null);
140
- setCursorPos(null);
146
+ // setInputAnchor(null);
147
+ // setCursorPos(null);
148
+ setHintMenuOpen(false);
141
149
  break;
142
150
  }
143
151
  default: {
144
- setCursorPos(inputRef.current?.selectionStart ?? null);
152
+ // setCursorPos(inputRef.current?.selectionStart ?? null);
153
+ setHintMenuOpen(true);
145
154
  }
146
155
  }
147
156
  };
@@ -156,7 +165,8 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
156
165
  onClick: (e) => {
157
166
  if (Object(e).target !== Object(e).currentTarget)
158
167
  return;
159
- setCursorPos(inputRef.current?.selectionStart ?? null);
168
+ // setCursorPos(inputRef.current?.selectionStart ?? null);
169
+ setHintMenuOpen(true);
160
170
  },
161
171
  },
162
172
  input: {
@@ -178,8 +188,9 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
178
188
  },
179
189
  } }),
180
190
  React.createElement(HintOptionsMenu, { inputAnchor: inputAnchor, inputRef: inputRef, textFieldRef: textFieldRef, options: currentHintOptions, focusIdx: focusIdx, onSelectHint: insertHint, onClose: () => {
181
- setInputAnchor(null);
182
- setCursorPos(null);
191
+ // setInputAnchor(null);
192
+ // setCursorPos(null);
193
+ setHintMenuOpen(false);
183
194
  } })));
184
195
  };
185
196
  export default RichFilterTextField;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@danikokonn/yarik-frontend-lib",
3
- "version": "2.0.58-test1",
3
+ "version": "2.0.58-test11",
4
4
  "license": "Apache-2.0",
5
5
  "description": "",
6
6
  "author": "",