@danikokonn/yarik-frontend-lib 2.0.58-test3 → 2.0.58-test31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/RichFilterTextField/RichFilterTextField.d.ts +1 -1
- package/dist/components/RichFilterTextField/RichFilterTextField.d.ts.map +1 -1
- package/dist/components/RichFilterTextField/RichFilterTextField.js +73 -51
- package/dist/components/RichFilterTextField/utils.d.ts.map +1 -1
- package/dist/components/RichFilterTextField/utils.js +2 -2
- package/dist/components/SmartTable/RowContent.d.ts +7 -3
- package/dist/components/SmartTable/RowContent.d.ts.map +1 -1
- package/dist/components/SmartTable/RowContent.js +4 -3
- package/dist/components/SmartTable/SmartTable.d.ts +3 -1
- package/dist/components/SmartTable/SmartTable.d.ts.map +1 -1
- package/dist/components/SmartTable/SmartTable.js +13 -11
- package/dist/components/SmartTable/SmartTableProps.d.ts +4 -2
- package/dist/components/SmartTable/SmartTableProps.d.ts.map +1 -1
- package/dist/types.d.ts +4 -2
- package/dist/types.d.ts.map +1 -1
- package/package.json +2 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import RichFilterTextFieldProps from "./RichFilterTextFieldProps";
|
|
3
|
-
declare const RichFilterTextField: ({ filterExpr, filterExprHist, fields, operators, additionalComponents, instant: _instant, onChange, onSelectFromHistory, }: RichFilterTextFieldProps) => React.JSX.Element;
|
|
3
|
+
declare const RichFilterTextField: ({ filterExpr, filterExprHist: searchHist, fields, operators, additionalComponents, instant: _instant, onChange, onSelectFromHistory, }: RichFilterTextFieldProps) => React.JSX.Element;
|
|
4
4
|
export default RichFilterTextField;
|
|
5
5
|
//# sourceMappingURL=RichFilterTextField.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RichFilterTextField.d.ts","sourceRoot":"","sources":["../../../src/components/RichFilterTextField/RichFilterTextField.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"RichFilterTextField.d.ts","sourceRoot":"","sources":["../../../src/components/RichFilterTextField/RichFilterTextField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAKN,MAAM,OAAO,CAAC;AAUf,OAAO,wBAAwB,MAAM,4BAA4B,CAAC;AAKlE,QAAA,MAAM,mBAAmB,GAAI,wIAS1B,wBAAwB,sBA+R1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useRef, useState, } from "react";
|
|
2
2
|
import IconButton from "@mui/material/IconButton";
|
|
3
3
|
import InputAdornment from "@mui/material/InputAdornment";
|
|
4
4
|
import TextField from "@mui/material/TextField";
|
|
@@ -7,46 +7,39 @@ 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
|
-
const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, additionalComponents, instant: _instant, onChange, onSelectFromHistory, }) => {
|
|
12
|
+
const RichFilterTextField = ({ filterExpr, filterExprHist: searchHist, fields, operators, additionalComponents, instant: _instant, onChange, onSelectFromHistory, }) => {
|
|
14
13
|
const { enqueueSnackbar } = useSnackbarContext();
|
|
15
14
|
const [search, setSearch] = useState(filterExpr);
|
|
16
|
-
const instant = _instant ?? true;
|
|
17
|
-
useEffect(() => setSearch(filterExpr), [filterExpr]);
|
|
18
|
-
const [searchHist, setSearchHist] = useState(filterExprHist);
|
|
19
|
-
const [inputAnchor, setInputAnchor] = useState(null);
|
|
20
15
|
const [cursorPos, setCursorPos] = useState(null);
|
|
21
|
-
const [currentHintOptions, setCurrentHintOptions] = useState(() => new Map());
|
|
22
16
|
const [focusIdx, setFocusIdx] = useState(0);
|
|
23
17
|
const inputRef = useRef(null);
|
|
24
18
|
const textFieldRef = useRef(null);
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
19
|
+
const prevFilterExpr = useRef(filterExpr);
|
|
20
|
+
const instant = _instant ?? true;
|
|
21
|
+
const currentHintOptions = (cursorPos != null
|
|
22
|
+
? getHints(search, cursorPos, fields, operators)
|
|
23
|
+
: null) ?? new Map();
|
|
24
|
+
const inputAnchor = currentHintOptions?.size > 0 ? textFieldRef.current : null;
|
|
25
|
+
if (prevFilterExpr.current !== filterExpr && filterExpr !== search) {
|
|
26
|
+
setSearch(filterExpr);
|
|
27
|
+
setCursorPos(null);
|
|
30
28
|
setFocusIdx(0);
|
|
31
|
-
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
return;
|
|
40
|
-
if (inputRef.current && cursorPos !== inputRef.current.selectionStart) {
|
|
41
|
-
inputRef.current.selectionStart = cursorPos;
|
|
42
|
-
inputRef.current.selectionEnd = cursorPos;
|
|
43
|
-
}
|
|
44
|
-
updateHints();
|
|
45
|
-
}, [cursorPos, search]);
|
|
46
|
-
// ###### Конец ужано уродливого эффекта #######
|
|
29
|
+
prevFilterExpr.current = filterExpr;
|
|
30
|
+
}
|
|
31
|
+
if (cursorPos != null &&
|
|
32
|
+
inputRef.current &&
|
|
33
|
+
cursorPos !== inputRef.current.selectionStart) {
|
|
34
|
+
inputRef.current.selectionStart = cursorPos;
|
|
35
|
+
inputRef.current.selectionEnd = cursorPos;
|
|
36
|
+
}
|
|
47
37
|
const handleChange = (value, _idx) => {
|
|
48
38
|
setSearch(value);
|
|
49
|
-
|
|
39
|
+
if (cursorPos &&
|
|
40
|
+
getHints(value, cursorPos, fields, operators) !== currentHintOptions)
|
|
41
|
+
setFocusIdx(0);
|
|
42
|
+
onChange(value /*(v: unknown) => setSearchHist(v as string[])*/);
|
|
50
43
|
};
|
|
51
44
|
const insertHint = (hint) => {
|
|
52
45
|
if (cursorPos == null)
|
|
@@ -61,13 +54,18 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
|
|
|
61
54
|
hint = hint.replace("regex", "");
|
|
62
55
|
}
|
|
63
56
|
const { newSearch, newPos } = insertInStrPos(search, cursorPos, hint, fields);
|
|
64
|
-
|
|
57
|
+
setSearch(newSearch);
|
|
58
|
+
if (instant)
|
|
59
|
+
onChange(newSearch);
|
|
60
|
+
let newCursorPos = newPos;
|
|
65
61
|
if (hint.includes("[") || hint.includes("(") || hint.includes("/")) {
|
|
66
|
-
|
|
67
|
-
}
|
|
68
|
-
else {
|
|
69
|
-
setCursorPos(newPos);
|
|
62
|
+
newCursorPos--;
|
|
70
63
|
}
|
|
64
|
+
setCursorPos(newCursorPos);
|
|
65
|
+
if (newCursorPos &&
|
|
66
|
+
getHints(newSearch, newCursorPos, fields, operators) !==
|
|
67
|
+
currentHintOptions)
|
|
68
|
+
setFocusIdx(0);
|
|
71
69
|
};
|
|
72
70
|
const handleKeyUp = (e) => {
|
|
73
71
|
switch (e.code) {
|
|
@@ -86,18 +84,23 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
|
|
|
86
84
|
insertHint(focusedHint);
|
|
87
85
|
}
|
|
88
86
|
else {
|
|
89
|
-
onChange(search
|
|
87
|
+
onChange(search);
|
|
88
|
+
inputRef.current?.blur();
|
|
90
89
|
}
|
|
91
90
|
break;
|
|
92
91
|
}
|
|
93
92
|
case "Escape":
|
|
94
93
|
case "Tab": {
|
|
95
|
-
setInputAnchor(null);
|
|
96
94
|
setCursorPos(null);
|
|
97
95
|
break;
|
|
98
96
|
}
|
|
99
97
|
default: {
|
|
100
|
-
|
|
98
|
+
const newCursorPos = inputRef.current?.selectionStart ?? null;
|
|
99
|
+
setCursorPos(newCursorPos);
|
|
100
|
+
if (newCursorPos &&
|
|
101
|
+
getHints(search, newCursorPos, fields, operators) !==
|
|
102
|
+
currentHintOptions)
|
|
103
|
+
setFocusIdx(0);
|
|
101
104
|
}
|
|
102
105
|
}
|
|
103
106
|
};
|
|
@@ -107,8 +110,12 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
|
|
|
107
110
|
case "ArrowRight":
|
|
108
111
|
case "Space":
|
|
109
112
|
case "Backspace": {
|
|
110
|
-
|
|
111
|
-
setCursorPos(
|
|
113
|
+
const newCursorPos = inputRef.current?.selectionStart ?? null;
|
|
114
|
+
setCursorPos(newCursorPos);
|
|
115
|
+
if (newCursorPos &&
|
|
116
|
+
getHints(search, newCursorPos, fields, operators) !==
|
|
117
|
+
currentHintOptions)
|
|
118
|
+
setFocusIdx(0);
|
|
112
119
|
return;
|
|
113
120
|
}
|
|
114
121
|
case "ArrowDown": {
|
|
@@ -141,34 +148,47 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
|
|
|
141
148
|
}
|
|
142
149
|
case "Escape":
|
|
143
150
|
case "Tab": {
|
|
144
|
-
setInputAnchor(null);
|
|
145
151
|
setCursorPos(null);
|
|
152
|
+
setFocusIdx(0);
|
|
146
153
|
break;
|
|
147
154
|
}
|
|
148
155
|
default: {
|
|
149
|
-
|
|
156
|
+
const newCursorPos = inputRef.current?.selectionStart ?? null;
|
|
157
|
+
setCursorPos(newCursorPos);
|
|
158
|
+
if (newCursorPos &&
|
|
159
|
+
getHints(search, newCursorPos, fields, operators) !==
|
|
160
|
+
currentHintOptions)
|
|
161
|
+
setFocusIdx(0);
|
|
150
162
|
}
|
|
151
163
|
}
|
|
152
164
|
};
|
|
153
165
|
return (React.createElement(React.Fragment, null,
|
|
154
|
-
React.createElement(TextField, { ref: textFieldRef, inputRef: inputRef, fullWidth: true, size: "small", value: search, title: search, multiline: true, maxRows: 1, onChange: (e) =>
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
166
|
+
React.createElement(TextField, { ref: textFieldRef, inputRef: inputRef, fullWidth: true, size: "small", value: search, title: search, multiline: true, maxRows: 1, onChange: (e) => {
|
|
167
|
+
(instant ? handleChange : setSearch)(e.target.value);
|
|
168
|
+
const newCursorPos = inputRef.current?.selectionStart ?? null;
|
|
169
|
+
setCursorPos(newCursorPos);
|
|
170
|
+
if (newCursorPos &&
|
|
171
|
+
getHints(e.target.value, newCursorPos, fields, operators) !==
|
|
172
|
+
currentHintOptions)
|
|
173
|
+
setFocusIdx(0);
|
|
174
|
+
}, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, slotProps: {
|
|
160
175
|
htmlInput: {
|
|
161
176
|
onClick: (e) => {
|
|
162
177
|
if (Object(e).target !== Object(e).currentTarget)
|
|
163
178
|
return;
|
|
164
|
-
|
|
179
|
+
const newCursorPos = inputRef.current?.selectionStart ?? null;
|
|
180
|
+
setCursorPos(newCursorPos);
|
|
181
|
+
if (newCursorPos &&
|
|
182
|
+
getHints(search, newCursorPos, fields, operators) !==
|
|
183
|
+
currentHintOptions)
|
|
184
|
+
setFocusIdx(0);
|
|
165
185
|
},
|
|
166
186
|
},
|
|
167
187
|
input: {
|
|
168
188
|
startAdornment: (React.createElement(InputAdornment, { position: "start" },
|
|
169
189
|
React.createElement(Stack, { direction: "row", sx: { alignItems: "center" } },
|
|
170
190
|
!instant && (React.createElement(IconButton, { onClick: (e) => {
|
|
171
|
-
onChange(search
|
|
191
|
+
onChange(search);
|
|
172
192
|
e.stopPropagation();
|
|
173
193
|
}, title: "\u041F\u043E\u0438\u0441\u043A" },
|
|
174
194
|
React.createElement(SearchRoundedIcon, null))),
|
|
@@ -177,14 +197,16 @@ const RichFilterTextField = ({ filterExpr, filterExprHist, fields, operators, ad
|
|
|
177
197
|
endAdornment: (React.createElement(InputAdornment, { position: "end" },
|
|
178
198
|
React.createElement(IconButton, { title: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440\u044B", disabled: !search, onClick: (e) => {
|
|
179
199
|
handleChange("");
|
|
200
|
+
setCursorPos(null);
|
|
201
|
+
setFocusIdx(0);
|
|
180
202
|
e.stopPropagation();
|
|
181
203
|
} },
|
|
182
204
|
React.createElement(ClearIcon, null)))),
|
|
183
205
|
},
|
|
184
206
|
} }),
|
|
185
207
|
React.createElement(HintOptionsMenu, { inputAnchor: inputAnchor, inputRef: inputRef, textFieldRef: textFieldRef, options: currentHintOptions, focusIdx: focusIdx, onSelectHint: insertHint, onClose: () => {
|
|
186
|
-
setInputAnchor(null);
|
|
187
208
|
setCursorPos(null);
|
|
209
|
+
setFocusIdx(0);
|
|
188
210
|
} })));
|
|
189
211
|
};
|
|
190
212
|
export default RichFilterTextField;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/RichFilterTextField/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,cAAc,EAEf,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/RichFilterTextField/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,cAAc,EAEf,MAAM,4BAA4B,CAAC;AAepC,eAAO,MAAM,QAAQ,GACnB,QAAQ,MAAM,EACd,WAAW,MAAM,EACjB,QAAQ,WAAW,EAAE,EACrB,WAAW,cAAc,EAAE,oCAyE5B,CAAC;AAEF,eAAO,MAAM,cAAc,GACzB,QAAQ,MAAM,EACd,WAAW,MAAM,EACjB,MAAM,MAAM,EACZ,QAAQ,WAAW,EAAE;;;CAoFtB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const getSingleMatch = (token, fields) => {
|
|
2
|
-
const matchedFields = fields.filter((v) => v.name.startsWith(token));
|
|
2
|
+
const matchedFields = fields.filter((v) => v.name.toLowerCase().startsWith(token.toLowerCase()));
|
|
3
3
|
if (matchedFields.length !== 1)
|
|
4
4
|
return undefined;
|
|
5
5
|
return matchedFields[0];
|
|
@@ -52,7 +52,7 @@ export const getHints = (search, cursorPos, fields, operators) => {
|
|
|
52
52
|
if (fieldHasValues && validToken) {
|
|
53
53
|
return getMapOf(matchedField?.values || []);
|
|
54
54
|
}
|
|
55
|
-
return getMapOf(fields.filter((v) => v.name.startsWith(token)));
|
|
55
|
+
return getMapOf(fields.filter((v) => v.name.toLowerCase().startsWith(token.toLowerCase())));
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import React, { ReactNode } from "react";
|
|
2
|
-
import { Column } from "../../types";
|
|
3
2
|
import { SxProps, Theme } from "@mui/material";
|
|
4
|
-
|
|
3
|
+
import { Column } from "../../types";
|
|
4
|
+
interface RowContentProps<T extends {
|
|
5
|
+
id: string;
|
|
6
|
+
}> {
|
|
5
7
|
row: T;
|
|
6
8
|
columns: Column<T>[];
|
|
7
9
|
onDoubleClick?(rowId: string | null): void;
|
|
@@ -9,6 +11,8 @@ interface RowContentProps<T> {
|
|
|
9
11
|
controlComponent?(row: T): ReactNode;
|
|
10
12
|
controlComponentColSx?: SxProps<Theme>;
|
|
11
13
|
}
|
|
12
|
-
export default function RowContent<T>({ row, columns, onSelectRow, onDoubleClick, controlComponent, controlComponentColSx, }: RowContentProps<T
|
|
14
|
+
export default function RowContent<T>({ row, columns, onSelectRow, onDoubleClick, controlComponent, controlComponentColSx, }: RowContentProps<T & {
|
|
15
|
+
id: string;
|
|
16
|
+
}>): React.JSX.Element;
|
|
13
17
|
export {};
|
|
14
18
|
//# sourceMappingURL=RowContent.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowContent.d.ts","sourceRoot":"","sources":["../../../src/components/SmartTable/RowContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"RowContent.d.ts","sourceRoot":"","sources":["../../../src/components/SmartTable/RowContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,UAAU,eAAe,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAC;CAAE;IACjD,GAAG,EAAE,CAAC,CAAC;IACP,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB,aAAa,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAC3C,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IACxC,gBAAgB,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,SAAS,CAAC;IACrC,qBAAqB,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;CACxC;AAUD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,CAAC,EAAE,EACpC,GAAG,EACH,OAAO,EACP,WAAW,EACX,aAAa,EACb,gBAAgB,EAChB,qBAAqB,GACtB,EAAE,eAAe,CAAC,CAAC,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;CAAE,CAAC,qBAoCtC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import TableCell from "@mui/material/TableCell";
|
|
3
|
+
import { JSONTree } from 'react-json-tree';
|
|
3
4
|
const hiddenTextStyle = {
|
|
4
5
|
whiteSpace: "nowrap",
|
|
5
6
|
overflow: "hidden",
|
|
@@ -16,10 +17,10 @@ export default function RowContent({ row, columns, onSelectRow, onDoubleClick, c
|
|
|
16
17
|
const selection = window.getSelection();
|
|
17
18
|
if (selection && selection.toString().length > 0)
|
|
18
19
|
return;
|
|
19
|
-
onSelectRow(
|
|
20
|
-
}, onDoubleClick: (_) => (onDoubleClick || (() => { }))(
|
|
20
|
+
onSelectRow(row.id);
|
|
21
|
+
}, onDoubleClick: (_) => (onDoubleClick || (() => { }))(row.id) }, col.cellContentComponent
|
|
21
22
|
? col.cellContentComponent(row)
|
|
22
|
-
: Object(row)[col.name] || "N/A"))),
|
|
23
|
+
: typeof Object(row)[col.name] === "object" && Object(row)[col.name] != null ? (React.createElement(JSONTree, { hideRoot: true, data: Object(row)[col.name] })) : Object(row)[col.name] || "N/A"))),
|
|
23
24
|
controlComponent && (React.createElement(TableCell, { sx: {
|
|
24
25
|
textAlign: "center",
|
|
25
26
|
cursor: "default",
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import SmartTableProps from "./SmartTableProps";
|
|
3
|
-
export default function SmartTable<T
|
|
3
|
+
export default function SmartTable<T extends {
|
|
4
|
+
id: string;
|
|
5
|
+
}>({ rows, columns, pageN, numPages, perPage, loading, minWidth, width, rowStyles, selectable, selectedRow, sx, disablePerPageSelector, globalSearch, columnAutoWidth, error, globalSearchComponent, ContentWrapper, onRowDoubleClick, onSelectRow, controlComponent: ControlComponent, onToggleSort, onInputSearch, onPageSelect, onChangePerPage, controlComponentColSx, perPageOptions, }: SmartTableProps<T>): React.JSX.Element;
|
|
4
6
|
//# sourceMappingURL=SmartTable.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SmartTable.d.ts","sourceRoot":"","sources":["../../../src/components/SmartTable/SmartTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"SmartTable.d.ts","sourceRoot":"","sources":["../../../src/components/SmartTable/SmartTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AA2BlD,OAAO,eAAe,MAAM,mBAAmB,CAAC;AA4GhD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAC;CAAE,EAAE,EAC5D,IAAI,EACJ,OAAO,EACP,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,QAAQ,EACR,KAAK,EACL,SAAS,EACT,UAAU,EACV,WAAW,EACX,EAAE,EACF,sBAAsB,EACtB,YAAY,EACZ,eAAe,EACf,KAAK,EACL,qBAAqB,EACrB,cAAc,EACd,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,eAAe,EACf,qBAAqB,EACrB,cAAc,GACf,EAAE,eAAe,CAAC,CAAC,CAAC,qBA4TpB"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { Fragment, Suspense } from "react";
|
|
2
|
+
import { CircularProgress, Skeleton, Stack, Typography, useTheme, } from "@mui/material";
|
|
2
3
|
import FormControl from "@mui/material/FormControl";
|
|
3
4
|
import InputLabel from "@mui/material/InputLabel";
|
|
4
5
|
import MenuItem from "@mui/material/MenuItem";
|
|
@@ -8,15 +9,14 @@ import Select from "@mui/material/Select";
|
|
|
8
9
|
import Table from "@mui/material/Table";
|
|
9
10
|
import TableBody from "@mui/material/TableBody";
|
|
10
11
|
import TableCell from "@mui/material/TableCell";
|
|
12
|
+
import TableContainer from "@mui/material/TableContainer";
|
|
11
13
|
import TableFooter from "@mui/material/TableFooter";
|
|
12
14
|
import TableRow from "@mui/material/TableRow";
|
|
13
|
-
import TableContainer from "@mui/material/TableContainer";
|
|
14
|
-
import { useTheme, Stack, CircularProgress, Typography, Skeleton, } from "@mui/material";
|
|
15
|
-
import SortBtn from "../SortBtn/SortBtn";
|
|
16
|
-
import ColumnSearchInput from "../ColumnSearchInput/ColumnSearchInput";
|
|
17
15
|
import { TableVirtuoso } from "react-virtuoso";
|
|
18
|
-
import
|
|
16
|
+
import ColumnSearchInput from "../ColumnSearchInput/ColumnSearchInput";
|
|
17
|
+
import SortBtn from "../SortBtn/SortBtn";
|
|
19
18
|
import RowContent from "./RowContent";
|
|
19
|
+
import TableHeader from "./TableHeader";
|
|
20
20
|
// eslint-disable-next-line react/display-name
|
|
21
21
|
const Scroller = React.forwardRef((props, ref) => (React.createElement(TableContainer, { component: Paper, ...props, ref: ref, sx: {
|
|
22
22
|
minWidth: Object(props).context.minWidth || "100%",
|
|
@@ -142,12 +142,14 @@ export default function SmartTable({ rows, columns, pageN, numPages, perPage, lo
|
|
|
142
142
|
hasGlobalSearch && (React.createElement(Table, { size: "small", className: "rulesTable", stickyHeader: true, sx: { ...tableStyle, minWidth: minWidth || "100%", height: "auto" } },
|
|
143
143
|
React.createElement(TableHeader, null, headerRows[1]))),
|
|
144
144
|
React.createElement(Suspense, { fallback: React.createElement(CircularProgress, { sx: { position: "absolute", left: "50%", top: "50%" } }) },
|
|
145
|
-
React.createElement(TableVirtuoso, { style: { height: "100%" }, totalCount: rows.length, data: rows, components: VirtuosoTableComponents, fixedHeaderContent: fixedHeaderContent, itemContent: (ItemContent), context: tableContext,
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
145
|
+
React.createElement(TableVirtuoso, { style: { height: "100%" }, totalCount: rows.length, data: rows, components: VirtuosoTableComponents, fixedHeaderContent: fixedHeaderContent, itemContent: (ItemContent), context: tableContext,
|
|
146
|
+
// scrollSeekConfiguration={{
|
|
147
|
+
// // «входим» в режим плейсхолдеров при скорости >200px/фрейм
|
|
148
|
+
// enter: (velocity) => Math.abs(velocity) > 50,
|
|
149
|
+
// // «выходим» обратно, когда скорость опустилась ниже 30px/фрейм
|
|
150
|
+
// exit: (velocity) => Math.abs(velocity) < 10,
|
|
151
|
+
// }}
|
|
152
|
+
increaseViewportBy: { top: 800, bottom: 800 } }))),
|
|
151
153
|
React.createElement(Table, { sx: { ...tableStyle, height: "auto", minWidth: minWidth || "100%" } },
|
|
152
154
|
React.createElement(TableFooter, { sx: {
|
|
153
155
|
bottom: "0%",
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
import { SxProps, TableRowProps, Theme } from "@mui/material";
|
|
1
2
|
import { ReactElement, ReactNode } from "react";
|
|
2
3
|
import { Column } from "../../types";
|
|
3
|
-
|
|
4
|
-
|
|
4
|
+
export default interface SmartTableProps<T extends {
|
|
5
|
+
id: string;
|
|
6
|
+
}> {
|
|
5
7
|
rows: T[];
|
|
6
8
|
columns: Column<T>[];
|
|
7
9
|
pageN: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SmartTableProps.d.ts","sourceRoot":"","sources":["../../../src/components/SmartTable/SmartTableProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"SmartTableProps.d.ts","sourceRoot":"","sources":["../../../src/components/SmartTable/SmartTableProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,CAAC,OAAO,WAAW,eAAe,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAC;CAAE;IAChE,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACpB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,YAAY,CAAC;IACrC,cAAc,CAAC,CAAC,EACd,QAAQ,EACR,KAAK,EACL,QAAQ,GACT,EAAE;QACD,QAAQ,CAAC,EAAE,SAAS,CAAC;QACrB,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,aAAa,CAAC;KACzB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACtB,WAAW,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,gBAAgB,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,SAAS,CAAC;IACrC,gBAAgB,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAC9C,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAClE,aAAa,CAAC,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;KAAE,EAAE,GAAG,IAAI,CAAC;IACnE,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,eAAe,CAAC,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACxC,qBAAqB,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACvC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;CAC3B"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ReactNode } from "react";
|
|
2
1
|
import { SxProps } from "@mui/material";
|
|
2
|
+
import { ReactNode } from "react";
|
|
3
3
|
export type DagState = "queued" | "running" | "success" | "failed";
|
|
4
4
|
export type TaskState = "success" | "running" | "failed" | "upstream_failed" | "skipped" | "up_for_retry" | "up_for_reschedule" | "queued" | "none" | "scheduled" | "deferred" | "removed" | "restarting";
|
|
5
5
|
export interface Dag {
|
|
@@ -63,7 +63,9 @@ export interface Logs {
|
|
|
63
63
|
continuationToken: string;
|
|
64
64
|
content: string;
|
|
65
65
|
}
|
|
66
|
-
export interface Column<T
|
|
66
|
+
export interface Column<T extends {
|
|
67
|
+
id: string;
|
|
68
|
+
}> {
|
|
67
69
|
name: string;
|
|
68
70
|
displayName: string;
|
|
69
71
|
fieldName: string;
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@danikokonn/yarik-frontend-lib",
|
|
3
|
-
"version": "2.0.58-
|
|
3
|
+
"version": "2.0.58-test31",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"description": "",
|
|
6
6
|
"author": "",
|
|
@@ -41,6 +41,7 @@
|
|
|
41
41
|
"react": "^18.3.1",
|
|
42
42
|
"react-dom": "^18.3.1",
|
|
43
43
|
"react-imask": "^7.6.1",
|
|
44
|
+
"react-json-tree": "^0.20.0",
|
|
44
45
|
"react-virtuoso": "^4.13.0",
|
|
45
46
|
"style-loader": "^4.0.0",
|
|
46
47
|
"transliteration": "^2.3.5"
|