@scheels-softdev/kendoreact-generics 4.0.17 → 4.0.19

package/GenericDropdown.js

@@ -14,8 +14,9 @@ import { useState, useMemo, useCallback } from "react";
 import { ComboBox } from "@progress/kendo-react-dropdowns";
 export function GenericDropdown(_a) {
     var { data, textField, pageSize = 6 } = _a, props = __rest(_a, ["data", "textField", "pageSize"]);
+    const [filteredData, setFilteredData] = useState(data);
     const [state, setState] = useState({
-        subsetData: data.slice(0, pageSize),
+        subsetData: filteredData.slice(0, pageSize),
         skip: 0,
     });
     const selectedItem = useMemo(() => {
@@ -24,21 +25,30 @@ export function GenericDropdown(_a) {
             return props.selectedData;
         }
         else if ("selectedId" in props && "idField" in props && props.selectedId !== undefined) {
-            return (_a = data.find((item) => item[props.idField] === String(props.selectedId))) !== null && _a !== void 0 ? _a : null;
+            return (_a = data.find((item) => String(item[props.idField]) === String(props.selectedId))) !== null && _a !== void 0 ? _a : null;
         }
         return null;
     }, [props, data]);
     const pageChange = useCallback((event) => {
         const { skip, take } = event.page;
         setState({
-            subsetData: data.slice(skip, skip + take),
+            subsetData: filteredData.slice(skip, skip + take),
             skip,
         });
-    }, [data]);
-    return (_jsx(ComboBox, Object.assign({ data: state.subsetData, value: selectedItem, textField: textField, virtual: {
-            pageSize: pageSize,
+    }, [filteredData]);
+    const handleFilter = useCallback((event) => {
+        const filterValue = event.filter.value;
+        const newData = data.filter((item) => item[textField].toString().toLowerCase().includes(filterValue.toLowerCase()));
+        setFilteredData(newData);
+        setState({
+            subsetData: newData.slice(0, pageSize),
+            skip: 0,
+        });
+    }, [data, textField, pageSize]);
+    return (_jsx(ComboBox, Object.assign({ data: state.subsetData, value: selectedItem, textField: textField, filterable: true, onFilterChange: handleFilter, virtual: {
+            pageSize,
             skip: state.skip,
-            total: data.length,
+            total: filteredData.length,
         }, onPageChange: pageChange }, props)));
 }
 export default GenericDropdown;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@scheels-softdev/kendoreact-generics",
-    "version": "4.0.17",
+    "version": "4.0.19",
     "main": "index.js",
     "scripts": {
         "test": "jest",