@scheels-softdev/kendoreact-generics 4.0.11 → 4.0.13

package/GenericDropdown.js

@@ -10,15 +10,11 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo, useState, useCallback } from "react";
+import React, { useMemo } from "react";
 import { ComboBox } from "@progress/kendo-react-dropdowns";
+import { filterBy } from "@progress/kendo-data-query";
 export function GenericDropdown(_a) {
     var { data, onClear } = _a, props = __rest(_a, ["data", "onClear"]);
-    const pageSize = props.pageSize || 6;
-    const [state, setState] = useState({
-        subsetData: data.slice(0, pageSize),
-        skip: 0,
-    });
     const selectedItem = useMemo(() => {
         var _a;
         if ("selectedData" in props) {
@@ -29,22 +25,31 @@ export function GenericDropdown(_a) {
         }
         return null;
     }, [props, data]);
-    const pageChange = useCallback((event) => {
-        const { skip, take } = event.page;
-        setState((prevState) => {
-            if (prevState.skip === skip) {
-                return prevState; // prevent re-render if skip hasn't changed
-            }
-            return {
-                subsetData: data.slice(skip, skip + take),
-                skip,
-            };
+    const filteredData = React.useRef(data.slice());
+    const [state, setState] = React.useState({
+        skip: 0,
+        total: data.length,
+        subsetData: data.slice(0, 11),
+    });
+    const onFilterChange = (event) => {
+        filteredData.current = filterBy(data.slice(), event.filter);
+        const newData = filteredData.current.slice(0, 11);
+        setState({
+            subsetData: newData,
+            skip: 0,
+            total: filteredData.current.length,
         });
-    }, [data]);
+    };
+    const pageChange = (event) => {
+        const skip = event.page.skip;
+        const take = event.page.take;
+        const newSubsetData = filteredData.current.slice(skip, skip + take);
+        setState(Object.assign(Object.assign({}, state), { subsetData: newSubsetData, skip: skip }));
+    };
     return (_jsx(ComboBox, Object.assign({ data: state.subsetData, value: selectedItem, virtual: {
-            pageSize: pageSize,
+            total: state.total,
+            pageSize: 11,
             skip: state.skip,
-            total: data.length,
-        }, onPageChange: pageChange }, props)));
+        }, onPageChange: pageChange, onFilterChange: onFilterChange, dataItemKey: "idField" in props ? props.idField : undefined }, props)));
 }
 export default GenericDropdown;

package/package.json

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