@scheels-softdev/kendoreact-generics 3.0.8 → 4.0.0
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/GenericDropdown.d.ts +6 -13
- package/GenericDropdown.js +30 -21
- package/_index.test.js +4 -4
- package/package.json +1 -1
package/GenericDropdown.d.ts
CHANGED
@@ -1,16 +1,9 @@
|
|
1
|
-
import
|
2
|
-
|
1
|
+
import { ComboBoxProps } from "@progress/kendo-react-dropdowns";
|
2
|
+
interface GenericDropdownProps<T> extends ComboBoxProps {
|
3
3
|
data: T[];
|
4
|
-
selectedId?: string | number;
|
5
4
|
selectedData?: T;
|
6
|
-
|
7
|
-
textField: keyof T;
|
5
|
+
selectedId?: number;
|
8
6
|
idField?: keyof T;
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
maxMenuHeight?: number;
|
13
|
-
menuStyle?: React.CSSProperties;
|
14
|
-
};
|
15
|
-
export declare function GenericDropdown<T extends Record<string, any>>({ data, selectedId, selectedData, onChange, textField, idField, style, isLoading, title, maxMenuHeight, menuStyle, }: GenericDDProps<T>): import("react/jsx-runtime").JSX.Element;
|
16
|
-
export {};
|
7
|
+
}
|
8
|
+
export declare function GenericDropdown<T>({ data, selectedData, selectedId, idField, ...props }: GenericDropdownProps<T>): import("react/jsx-runtime").JSX.Element;
|
9
|
+
export default GenericDropdown;
|
package/GenericDropdown.js
CHANGED
@@ -1,25 +1,34 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
1
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
-
import
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
: (_b = options.find((option) => option.value === selectedData)) !== null && _b !== void 0 ? _b : null;
|
12
|
-
const handleChange = (selectedOption) => {
|
13
|
-
if (selectedOption) {
|
14
|
-
const selectedItem = idField ? data.find((item) => item[idField].toString() === selectedOption.value.id) : selectedOption.value;
|
15
|
-
onChange(selectedItem !== null && selectedItem !== void 0 ? selectedItem : null);
|
13
|
+
import React from "react";
|
14
|
+
import { ComboBox } from "@progress/kendo-react-dropdowns";
|
15
|
+
// Create the GenericDropdown component
|
16
|
+
export function GenericDropdown(_a) {
|
17
|
+
var { data, selectedData, selectedId, idField } = _a, props = __rest(_a, ["data", "selectedData", "selectedId", "idField"]);
|
18
|
+
// Determine the actual selected item based on id or direct data
|
19
|
+
const selectedItem = React.useMemo(() => {
|
20
|
+
if (selectedData) {
|
21
|
+
return selectedData;
|
16
22
|
}
|
17
|
-
|
18
|
-
|
23
|
+
if (selectedId !== undefined && idField) {
|
24
|
+
return data.find((item) => item[idField] === selectedId);
|
19
25
|
}
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
26
|
+
return undefined;
|
27
|
+
}, [selectedId, idField, selectedData, data]);
|
28
|
+
return (_jsx(ComboBox, Object.assign({ data: data, value: selectedItem, virtual: {
|
29
|
+
pageSize: 20,
|
30
|
+
skip: 0,
|
31
|
+
total: data.length,
|
32
|
+
} }, props)));
|
25
33
|
}
|
34
|
+
export default GenericDropdown;
|
package/_index.test.js
CHANGED
@@ -10,7 +10,7 @@ describe("GenericDropdown", () => {
|
|
10
10
|
// Set initial selectedData to the second item in the data array
|
11
11
|
let selectedData = data[1];
|
12
12
|
// Render the GenericDropdown component with the data, onChange function, textField prop, and selectedData prop
|
13
|
-
let result = render(_jsx(GenericDropdown, { data: data, onChange: () => { }, textField: "name", selectedData: selectedData }));
|
13
|
+
let result = render(_jsx(GenericDropdown, { data: data, onChange: (e) => { }, textField: "name", selectedData: selectedData }));
|
14
14
|
// Get the input element by its role of "combobox"
|
15
15
|
const input = result.getByRole("combobox");
|
16
16
|
expect(input.getAttribute("value")).toBe("Option 2");
|
@@ -56,7 +56,7 @@ describe("GenericDropdown", () => {
|
|
56
56
|
// Set initial selectedData to the second item in the data array
|
57
57
|
let selectedData = data[1];
|
58
58
|
// Render the GenericDropdown component with the data, onChange function, textField prop, and selectedData prop
|
59
|
-
let result = render(_jsx(GenericDropdown, { data: data, onChange: (e) => (selectedData = e), textField: "name", selectedData: selectedData }));
|
59
|
+
let result = render(_jsx(GenericDropdown, { data: data, onChange: (e) => (selectedData = e.value), textField: "name", selectedData: selectedData }));
|
60
60
|
// Get the input element by its role of "combobox"
|
61
61
|
// Simulate a change event on the input element by setting its target value to "O"
|
62
62
|
let input = result.getByRole("combobox");
|
@@ -72,7 +72,7 @@ describe("GenericDropdown", () => {
|
|
72
72
|
// Set initial selectedData to the second item in the data array
|
73
73
|
let selectedId = 1;
|
74
74
|
// Render the GenericDropdown component with the data, onChange function, textField prop, and selectedData prop
|
75
|
-
let result = render(_jsx(GenericDropdown, { data: data, onChange: (e) => (selectedId = (e === null || e === void 0 ? void 0 : e.id) || null), textField: "name", selectedId: selectedId, idField: "id" }));
|
75
|
+
let result = render(_jsx(GenericDropdown, { data: data, onChange: (e) => (selectedId = (e === null || e === void 0 ? void 0 : e.value.id) || null), textField: "name", selectedId: selectedId, idField: "id" }));
|
76
76
|
// Get the input element by its role of "combobox"
|
77
77
|
// Simulate a change event on the input element by setting its target value to "O"
|
78
78
|
let input = result.getByRole("combobox");
|
@@ -88,7 +88,7 @@ describe("GenericDropdown", () => {
|
|
88
88
|
// Set initial selectedData to the second item in the data array
|
89
89
|
let selectedData = data[1];
|
90
90
|
// Render the GenericDropdown component with the data, onChange function, textField prop, and selectedData prop
|
91
|
-
let result = render(_jsx(GenericDropdown, { data: data, onChange: (e) => (selectedData = e), textField: "name", selectedData: selectedData }));
|
91
|
+
let result = render(_jsx(GenericDropdown, { data: data, onChange: (e) => (selectedData = e.value), textField: "name", selectedData: selectedData }));
|
92
92
|
let input = result.getByRole("combobox"); // Get the input element by its role of "combobox"
|
93
93
|
fireEvent.change(input, { target: { value: "9" } }); //simulate a change event on the input element
|
94
94
|
// Query the rendered result for elements with the text "Option 1" and "Option 9", and store the results in variables
|