@scheels-softdev/kendoreact-generics 4.0.17 → 4.0.18

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(() => {
@@ -31,14 +32,23 @@ export function GenericDropdown(_a) {
     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.18",
     "main": "index.js",
     "scripts": {
         "test": "jest",