@absreim/react-bootstrap-data-grid-pro 2.4.0

package/grid/main/ColHeaderCell/useSortHeaderStates.js

@@ -0,0 +1,54 @@
+import useControlledHover from "../../util/useControlledHover";
+import { useMemo } from "react";
+import upArrow from "../../sorting/upArrow";
+import arrowPlaceholder from "../../sorting/arrowPlaceholder";
+import downArrow from "../../sorting/downArrow";
+var useSortHeaderStates = function (sortModel) {
+    var _a = useControlledHover(), isHovering = _a.isHovering, setIsHovering = _a.setIsHovering, handleMouseOver = _a.handleMouseOver, handleMouseOut = _a.handleMouseOut;
+    var handleClick = function () {
+        if (!sortModel) {
+            return;
+        }
+        switch (sortModel.sortOrder) {
+            case null: {
+                sortModel.setSortOrder("asc");
+                return;
+            }
+            case "asc": {
+                sortModel.setSortOrder("desc");
+                return;
+            }
+            case "desc": {
+                sortModel.setSortOrder(null);
+            }
+        }
+    };
+    var sortSymbol = useMemo(function () {
+        if (!sortModel) {
+            return null;
+        }
+        switch (sortModel.sortOrder) {
+            case null: {
+                if (isHovering) {
+                    return upArrow(true);
+                }
+                return arrowPlaceholder;
+            }
+            case "asc": {
+                return upArrow(false);
+            }
+            case "desc": {
+                return downArrow;
+            }
+        }
+    }, [isHovering, sortModel]);
+    return {
+        isHovering: isHovering,
+        setIsHovering: setIsHovering,
+        handleMouseOver: handleMouseOver,
+        handleMouseOut: handleMouseOut,
+        handleClick: handleClick,
+        sortSymbol: sortSymbol,
+    };
+};
+export default useSortHeaderStates;

package/grid/main/ToggleButton.d.ts

@@ -0,0 +1,9 @@
+import { FC } from "react";
+export interface ToggleButtonProps {
+    isActive: boolean;
+    label: string;
+    onClick: () => void;
+    classes?: string[];
+}
+declare const ToggleButton: FC<ToggleButtonProps>;
+export default ToggleButton;

package/grid/main/ToggleButton.js

@@ -0,0 +1,14 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import classNames from "classnames";
+var ToggleButton = function (_a) {
+    var isActive = _a.isActive, label = _a.label, onClick = _a.onClick, classes = _a.classes;
+    var baseClasses = ["btn"];
+    var variableClasses = {
+        active: isActive,
+    };
+    return (_jsx("button", { type: "button", className: classNames(baseClasses, variableClasses, classes, {
+            "btn-primary": !(classes && classes.length > 0),
+        }), "aria-pressed": isActive, onClick: onClick, children: label }));
+};
+export default ToggleButton;

package/grid/pagination/PageSelector.d.ts

@@ -0,0 +1,24 @@
+import { JustifyContentSetting, Size } from "../types";
+import { FC } from "react";
+export interface PageSelectorProps {
+    numPages: number;
+    pageNum: number;
+    numButtons: number;
+    setPageNum: (pageNum: number) => void;
+    ariaLabel?: string;
+    alignment?: JustifyContentSetting;
+    size?: Size;
+}
+/**
+ * An interactive pagination component that parameterizes Bootstrap styling
+ * options as props.
+ * @param numPages - Total number of pages
+ * @param numButtons - Number of buttons of numerical indices to show at once
+ * @param pageNum - The currently selected page
+ * @param setPageNum - Callback function to set the selected page
+ * @param ariaLabel - Aria label of the <nav> element
+ * @param alignment - Flexbox justify-content setting on the <ul> element
+ * @param size - Size variant of the <ul> element
+ */
+declare const PageSelector: FC<PageSelectorProps>;
+export default PageSelector;

package/grid/pagination/PageSelector.js

@@ -0,0 +1,92 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import classNames from "classnames";
+/**
+ * An interactive pagination component that parameterizes Bootstrap styling
+ * options as props.
+ * @param numPages - Total number of pages
+ * @param numButtons - Number of buttons of numerical indices to show at once
+ * @param pageNum - The currently selected page
+ * @param setPageNum - Callback function to set the selected page
+ * @param ariaLabel - Aria label of the <nav> element
+ * @param alignment - Flexbox justify-content setting on the <ul> element
+ * @param size - Size variant of the <ul> element
+ */
+var PageSelector = function (_a) {
+    var numPages = _a.numPages, numButtons = _a.numButtons, pageNum = _a.pageNum, setPageNum = _a.setPageNum, ariaLabel = _a.ariaLabel, alignment = _a.alignment, size = _a.size;
+    var ulClasses = ["pagination"];
+    if (size === "small") {
+        ulClasses.push("pagination-sm");
+    }
+    else if (size === "large") {
+        ulClasses.push("pagination-lg");
+    }
+    if (alignment) {
+        ulClasses.push("justify-content-".concat(alignment));
+    }
+    var lowerBound = pageNum - Math.floor((numButtons - 1) / 2);
+    var upperBound = pageNum + Math.ceil((numButtons - 1) / 2);
+    if (upperBound > numPages) {
+        var diff = upperBound - numPages;
+        lowerBound = Math.max(lowerBound - diff, 1);
+        upperBound -= diff;
+    }
+    else if (lowerBound < 1) {
+        var diff = 1 - lowerBound;
+        lowerBound = 1;
+        upperBound = Math.min(numPages, upperBound + diff);
+    }
+    var buttonIndices = useMemo(function () {
+        var indices = [];
+        for (var i = lowerBound; i <= upperBound; i++) {
+            indices.push(i);
+        }
+        return indices;
+    }, [lowerBound, upperBound]);
+    function getFirstArrowButton() {
+        if (lowerBound === 1) {
+            return null;
+        }
+        return (_jsx("li", { className: "page-item", children: _jsx("a", { className: "page-link", href: "#", "aria-label": "First", onClick: function (event) {
+                    event.preventDefault();
+                    setPageNum(1);
+                }, children: _jsx("span", { "aria-hidden": "true", children: "<<" }) }) }));
+    }
+    function getPrevArrowButton() {
+        if (pageNum === 1) {
+            return null;
+        }
+        return (_jsx("li", { className: "page-item", children: _jsx("a", { className: "page-link", href: "#", "aria-label": "Previous", onClick: function (event) {
+                    event.preventDefault();
+                    setPageNum(pageNum - 1);
+                }, children: _jsx("span", { "aria-hidden": "true", children: "<" }) }) }));
+    }
+    function getNextArrowButton() {
+        if (pageNum === numPages) {
+            return null;
+        }
+        return (_jsx("li", { className: "page-item", children: _jsx("a", { className: "page-link", href: "#", "aria-label": "Next", onClick: function (event) {
+                    event.preventDefault();
+                    setPageNum(pageNum + 1);
+                }, children: _jsx("span", { "aria-hidden": "true", children: ">" }) }) }));
+    }
+    function getLastArrowButton() {
+        if (upperBound === numPages) {
+            return null;
+        }
+        return (_jsx("li", { className: "page-item", children: _jsx("a", { className: "page-link", href: "#", "aria-label": "Last", onClick: function (event) {
+                    event.preventDefault();
+                    setPageNum(numPages);
+                }, children: _jsx("span", { "aria-hidden": "true", children: ">>" }) }) }));
+    }
+    var indexButtons = buttonIndices.map(function (buttonIndex) { return (_jsx("li", { className: classNames({
+            "page-item": true,
+            active: pageNum === buttonIndex,
+        }), "aria-current": pageNum === buttonIndex ? "page" : undefined, children: _jsx("a", { className: "page-link", href: "#", onClick: function (event) {
+                event.preventDefault();
+                setPageNum(buttonIndex);
+            }, children: buttonIndex }) }, buttonIndex)); });
+    return (_jsx("nav", { "aria-label": ariaLabel, children: _jsxs("ul", { className: classNames(ulClasses), children: [getFirstArrowButton(), getPrevArrowButton(), indexButtons, getNextArrowButton(), getLastArrowButton()] }) }));
+};
+export default PageSelector;

package/grid/pagination/PageSizeSelector.d.ts

@@ -0,0 +1,10 @@
+import { FC } from "react";
+import { Size } from "../types";
+export interface PageSizeSelectorProps {
+    componentSize: Size;
+    pageSizeOptions: number[];
+    pageSizeIndex: number;
+    handleSetPageSize: (index: number) => void;
+}
+declare const PageSizeSelector: FC<PageSizeSelectorProps>;
+export default PageSizeSelector;

package/grid/pagination/PageSizeSelector.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import classNames from "classnames";
+var PageSizeSelector = function (_a) {
+    var componentSize = _a.componentSize, pageSizeOptions = _a.pageSizeOptions, pageSizeIndex = _a.pageSizeIndex, handleSetPageSize = _a.handleSetPageSize;
+    var onChange = function (event) {
+        var pageSizeIndex = Number(event.target.value);
+        handleSetPageSize(pageSizeIndex);
+    };
+    return (_jsx("div", { children: _jsx("select", { className: classNames({
+                "form-select": true,
+                "form-select-lg": componentSize === "large",
+                "form-select-sm": componentSize === "small",
+            }), value: pageSizeIndex, "aria-label": "Number of Rows per Page", onChange: onChange, children: pageSizeOptions.map(function (numRows, index) { return (_jsx("option", { value: index, children: numRows }, index)); }) }) }));
+};
+export default PageSizeSelector;

package/grid/pagination/Pagination.d.ts

@@ -0,0 +1,9 @@
+import { FC } from "react";
+import { NormalizedPaginationModel } from "./types";
+export interface PaginationProps {
+    normalizedModel: NormalizedPaginationModel;
+    prePagingNumRows: number;
+    containerDivClasses: string[];
+}
+declare const Pagination: FC<PaginationProps>;
+export default Pagination;

package/grid/pagination/Pagination.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import PageSizeSelector from "./PageSizeSelector";
+import PageSelector from "./PageSelector";
+import classNames from "classnames";
+var Pagination = function (_a) {
+    var normalizedModel = _a.normalizedModel, prePagingNumRows = _a.prePagingNumRows, containerDivClasses = _a.containerDivClasses;
+    var pageSizeOptions = normalizedModel.pageSizeOptions, pageSizeIndex = normalizedModel.pageSizeIndex, currentPage = normalizedModel.currentPage, setCurrentPage = normalizedModel.setCurrentPage, setPageSizeIndex = normalizedModel.setPageSizeIndex, componentSize = normalizedModel.componentSize, maxPageButtons = normalizedModel.maxPageButtons, pageSelectorAriaLabel = normalizedModel.pageSelectorAriaLabel, pageSelectorJustifyContent = normalizedModel.pageSelectorJustifyContent;
+    var numPages = Math.ceil(prePagingNumRows / pageSizeOptions[pageSizeIndex]);
+    var pageIndexAwarePageSizeSetter = function (newPageSizeIndex) {
+        var newPageSize = pageSizeOptions[newPageSizeIndex];
+        var maxPages = Math.ceil(prePagingNumRows / newPageSize);
+        setPageSizeIndex(newPageSizeIndex);
+        // The new page size can cause the current page number to be out of bounds.
+        // In that case, set the page num to the maximum possible with new page
+        // size.
+        if (currentPage > maxPages) {
+            setCurrentPage(maxPages);
+        }
+    };
+    return (_jsxs("div", { "data-testid": "pagination ui container div", className: classNames(containerDivClasses.length > 0
+            ? containerDivClasses
+            : ["d-flex", "justify-content-end", "gap-2", "px-2"]), children: [_jsx(PageSizeSelector, { componentSize: componentSize, pageSizeOptions: pageSizeOptions, pageSizeIndex: pageSizeIndex, handleSetPageSize: pageIndexAwarePageSizeSetter }), _jsx(PageSelector, { numPages: numPages, pageNum: currentPage, numButtons: maxPageButtons, setPageNum: setCurrentPage, size: componentSize, ariaLabel: pageSelectorAriaLabel, alignment: pageSelectorJustifyContent })] }));
+};
+export default Pagination;

package/grid/pagination/types.d.ts

@@ -0,0 +1,22 @@
+import { JustifyContentSetting, Size } from "../types";
+export interface PaginationOptions {
+    pageSizeOptions?: number[];
+    maxPageButtons?: number;
+    componentSize?: Size;
+    pageSelectorAriaLabel?: string;
+    pageSelectorJustifyContent?: JustifyContentSetting;
+}
+export type ControlledPaginationModel = PaginationOptions & {
+    type?: "controlled";
+    pageSizeIndex: number;
+    setPageSizeIndex: (pageSizeIndex: number) => void;
+    currentPage: number;
+    setCurrentPage: (pageNum: number) => void;
+};
+export type UncontrolledPaginationModel = PaginationOptions & {
+    type: "uncontrolled";
+    startingPageSizeIndex?: number;
+    startingCurrentPage?: number;
+};
+export type GridPaginationState = ControlledPaginationModel | UncontrolledPaginationModel;
+export type NormalizedPaginationModel = Required<Omit<ControlledPaginationModel, "type" | "pageSelectorAriaLabel" | "pageSelectorJustifyContent">> & Pick<ControlledPaginationModel, "pageSelectorAriaLabel" | "pageSelectorJustifyContent">;

package/grid/pagination/types.js

@@ -0,0 +1 @@
+export {};

package/grid/pipeline/types.d.ts

@@ -0,0 +1 @@
+export type ColNameToWidth<ColName extends string = string> = Record<ColName, number | undefined>;

package/grid/pipeline/types.js

@@ -0,0 +1 @@
+export {};

package/grid/pipeline/useAugFormattedRows.d.ts

@@ -0,0 +1,4 @@
+import { AugFormattedRow, FormattedRow } from "../types";
+import { ColNameToWidth } from "./types";
+declare const useAugFormattedRows: (colNameToWidth: ColNameToWidth, rows: FormattedRow[]) => AugFormattedRow[];
+export default useAugFormattedRows;

package/grid/pipeline/useAugFormattedRows.js

@@ -0,0 +1,22 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { useMemo } from "react";
+var useAugFormattedRows = function (colNameToWidth, rows) {
+    return useMemo(function () {
+        return rows.map(function (row) {
+            return __assign(__assign({}, row), { contents: row.contents.map(function (cell) {
+                    return __assign(__assign({}, cell), { width: colNameToWidth[cell.fieldName] });
+                }) });
+        });
+    }, [colNameToWidth, rows]);
+};
+export default useAugFormattedRows;

package/grid/pipeline/useCombinedPipeline/index.d.ts

@@ -0,0 +1,19 @@
+import { SortedRowsOutput } from "./useSortedRows";
+import { CurrentPageRowsOutput } from "./useCurrentPageRows";
+import { ColDefBase, FormattedRow, GridProps, RowDef } from "../../types";
+import { NormalizedTableFilterModel, TableFilterState } from "../../filtering/types";
+export type CombinedPipelineParams = Pick<GridProps, "rows" | "filterModel" | "sortModel" | "pagination" | "selectModel"> & {
+    cols: ColDefBase[];
+};
+export interface UseCombinedPipelineHook {
+    normalizedTableFilterModel: NormalizedTableFilterModel | null;
+    filteredRows: RowDef[];
+    filterState: TableFilterState | null;
+    sortedRowsOutput: SortedRowsOutput;
+    currentPageRowsOutput: CurrentPageRowsOutput;
+    showSelectCol: boolean;
+    ariaColIndexOffset: number;
+    displayRows: FormattedRow[];
+}
+declare const UseCombinedPipeline: (params: CombinedPipelineParams) => UseCombinedPipelineHook;
+export default UseCombinedPipeline;

package/grid/pipeline/useCombinedPipeline/index.js

@@ -0,0 +1,31 @@
+import useFilterStateStore from "./useFilterStateStore";
+import useFilter from "./useFilter";
+import useFilterStateFromEditable from "./useFilterStateFromEditable";
+import useSortedRows from "./useSortedRows";
+import useCurrentPageRows from "./useCurrentPageRows";
+import useDisplayRows from "./useDisplayRows";
+var UseCombinedPipeline = function (_a) {
+    var filterModel = _a.filterModel, cols = _a.cols, rows = _a.rows, sortModel = _a.sortModel, pagination = _a.pagination, selectModel = _a.selectModel;
+    var normalizedTableFilterModel = useFilterStateStore(filterModel, cols);
+    var editableFilterState = (normalizedTableFilterModel === null || normalizedTableFilterModel === void 0 ? void 0 : normalizedTableFilterModel.tableFilterState) || null;
+    var filteredRows = useFilter(rows, editableFilterState);
+    var filterState = useFilterStateFromEditable(cols, editableFilterState);
+    var sortedRowsOutput = useSortedRows(filteredRows, cols, sortModel);
+    var sortedRows = sortedRowsOutput.sortedRows;
+    var currentPageRowsOutput = useCurrentPageRows(sortedRows, pagination);
+    var showSelectCol = !!(selectModel && selectModel.mode !== "row");
+    var ariaColIndexOffset = showSelectCol ? 1 : 0;
+    var paginatedRows = currentPageRowsOutput.paginatedRows;
+    var displayRows = useDisplayRows(paginatedRows, cols, ariaColIndexOffset);
+    return {
+        normalizedTableFilterModel: normalizedTableFilterModel,
+        filteredRows: filteredRows,
+        filterState: filterState,
+        sortedRowsOutput: sortedRowsOutput,
+        currentPageRowsOutput: currentPageRowsOutput,
+        showSelectCol: showSelectCol,
+        ariaColIndexOffset: ariaColIndexOffset,
+        displayRows: displayRows,
+    };
+};
+export default UseCombinedPipeline;

package/grid/pipeline/useCombinedPipeline/useCurrentPageRows.d.ts

@@ -0,0 +1,8 @@
+import { RowDef } from "../../types";
+import { NormalizedPaginationModel, GridPaginationState } from "../../pagination/types";
+export interface CurrentPageRowsOutput {
+    paginatedRows: RowDef[];
+    normalizedModel: NormalizedPaginationModel | null;
+}
+declare const useCurrentPageRows: (sortedRows: RowDef[], paginationModel: GridPaginationState | undefined) => CurrentPageRowsOutput;
+export default useCurrentPageRows;

package/grid/pipeline/useCombinedPipeline/useCurrentPageRows.js

@@ -0,0 +1,52 @@
+import { useMemo, useState } from "react";
+var useCurrentPageRows = function (sortedRows, paginationModel) {
+    var componentSize = (paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.componentSize) || "medium";
+    var isControlled = (paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.type) !== "uncontrolled";
+    var _a = useState(isControlled ? 0 : paginationModel.startingPageSizeIndex || 0), internalPageSizeIndex = _a[0], setInternalPageSizeIndex = _a[1];
+    var pageSizeIndex = isControlled
+        ? (paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.pageSizeIndex) || 0
+        : internalPageSizeIndex;
+    var setPageSizeIndex = isControlled
+        ? paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.setPageSizeIndex
+        : setInternalPageSizeIndex;
+    var _b = useState(isControlled ? 1 : paginationModel.startingCurrentPage || 1), internalPageNum = _b[0], setInternalPageNum = _b[1];
+    var currentPage = isControlled
+        ? (paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.currentPage) || 1
+        : internalPageNum;
+    var setCurrentPage = isControlled
+        ? paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.setCurrentPage
+        : setInternalPageNum;
+    var maxPageButtons = (paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.maxPageButtons) || 5;
+    return useMemo(function () {
+        if (paginationModel === undefined) {
+            return { paginatedRows: sortedRows, normalizedModel: null };
+        }
+        var pageSizeOptions = (paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.pageSizeOptions) || [10, 25, 100];
+        var normalizedModel = {
+            pageSizeIndex: pageSizeIndex,
+            setPageSizeIndex: setPageSizeIndex,
+            currentPage: currentPage,
+            setCurrentPage: setCurrentPage,
+            pageSizeOptions: pageSizeOptions,
+            maxPageButtons: maxPageButtons,
+            componentSize: componentSize,
+            pageSelectorAriaLabel: paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.pageSelectorAriaLabel,
+            pageSelectorJustifyContent: paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.pageSelectorJustifyContent,
+        };
+        var pageSize = pageSizeOptions[pageSizeIndex];
+        var lowerIndex = pageSize * (currentPage - 1);
+        var upperIndex = lowerIndex + pageSize;
+        var paginatedRows = sortedRows.slice(lowerIndex, upperIndex);
+        return { paginatedRows: paginatedRows, normalizedModel: normalizedModel };
+    }, [
+        paginationModel,
+        pageSizeIndex,
+        setPageSizeIndex,
+        currentPage,
+        setCurrentPage,
+        maxPageButtons,
+        componentSize,
+        sortedRows,
+    ]);
+};
+export default useCurrentPageRows;

package/grid/pipeline/useCombinedPipeline/useDisplayRows.d.ts

@@ -0,0 +1,3 @@
+import { RowDef, FormattedRow, ColDef } from "../../types";
+declare const useDisplayRows: (currentPageRows: RowDef[], cols: ColDef[], ariaColIndexOffset: number) => FormattedRow[];
+export default useDisplayRows;

package/grid/pipeline/useCombinedPipeline/useDisplayRows.js

@@ -0,0 +1,60 @@
+import { useMemo } from "react";
+import { dateToDatetimeInputStr, dateToInputStr } from "../../util/datetime";
+var getFormattedValue = function (value, formatter, typeString) {
+    if (formatter) {
+        return formatter(value);
+    }
+    if (typeString === "date") {
+        return dateToInputStr(value);
+    }
+    if (typeString === "datetime") {
+        return dateToDatetimeInputStr(value);
+    }
+    if (typeString === "number") {
+        return value.toString();
+    }
+    return value;
+};
+var useDisplayRows = function (currentPageRows, cols, ariaColIndexOffset) {
+    return useMemo(function () {
+        var nameToIndex = new Map();
+        cols.forEach(function (_a, index) {
+            var name = _a.name;
+            nameToIndex.set(name, index);
+        });
+        return currentPageRows.map(function (row, index) {
+            cols
+                .map(function (_a) {
+                var name = _a.name;
+                return name;
+            })
+                .forEach(function (name) {
+                if (!(name in row.data)) {
+                    throw new Error("Column definition specifies a property named \"".concat(name, "\", but it was not found in the row data object at index ").concat(index, "."));
+                }
+            });
+            var displayRow = [];
+            Object.keys(row.data).forEach(function (name) {
+                if (!nameToIndex.has(name)) {
+                    console.error("Warning: row data contains a property named \"".concat(name, "\", but it was not found among the column definitions."));
+                    return;
+                }
+                var index = nameToIndex.get(name);
+                var col = cols[index];
+                var formatter = col.formatter;
+                var typeString = col.type;
+                var value = row.data[name];
+                displayRow[index] = {
+                    fieldName: cols[index].name,
+                    value: value,
+                    type: typeString,
+                    ariaColIndex: index + 1 + ariaColIndexOffset,
+                    formattedValue: getFormattedValue(value, formatter, typeString),
+                    label: cols[index].label,
+                };
+            });
+            return { contents: displayRow, id: row.id };
+        });
+    }, [currentPageRows, cols, ariaColIndexOffset]);
+};
+export default useDisplayRows;

package/grid/pipeline/useCombinedPipeline/useFilter.d.ts

@@ -0,0 +1,4 @@
+import { RowDef } from "../../types";
+import { EditableTableFilterState } from "../../filtering/types";
+declare const useFilter: (rows: RowDef[], filterState: EditableTableFilterState | null) => RowDef[];
+export default useFilter;

package/grid/pipeline/useCombinedPipeline/useFilter.js

@@ -0,0 +1,84 @@
+import { useMemo } from "react";
+var useFilter = function (rows, filterState) {
+    return useMemo(function () {
+        if (filterState === null) {
+            return rows;
+        }
+        return rows.filter(function (row) {
+            function checkIfPassesStringFilter(value, state) {
+                switch (state.scheme) {
+                    case "contains": {
+                        return value.includes(state.searchString);
+                    }
+                    case "startsWith": {
+                        return value.startsWith(state.searchString);
+                    }
+                    default: {
+                        return value.endsWith(state.searchString);
+                    }
+                }
+            }
+            function checkIfPassesNumberFilter(value, state) {
+                // Note that a blank string becomes 0. This situation should usually be
+                // prevented by form validation.
+                var numValue = Number(state.numValue);
+                switch (state.scheme) {
+                    case "equals":
+                        return value === numValue;
+                    case "greaterThan":
+                        return value > numValue;
+                    case "lessThan":
+                        return value < numValue;
+                    case "greaterOrEqual":
+                        return value >= numValue;
+                    default:
+                        return value <= numValue;
+                }
+            }
+            function checkIfPassesDateFilter(value, state) {
+                switch (state.scheme) {
+                    case "startFrom":
+                        return state.startDate === null || value >= state.startDate;
+                    case "endAt":
+                        return state.endDate === null || value <= state.endDate;
+                    case "between":
+                        return (state.startDate === null ||
+                            state.endDate === null ||
+                            (value >= state.startDate && value <= state.endDate));
+                }
+            }
+            var columnNames = Object.keys(row.data);
+            for (var _i = 0, columnNames_1 = columnNames; _i < columnNames_1.length; _i++) {
+                var columnName = columnNames_1[_i];
+                if (!(columnName in filterState)) {
+                    continue;
+                }
+                if (!filterState[columnName].enabled) {
+                    continue;
+                }
+                var columnFilterState = filterState[columnName];
+                switch (columnFilterState.type) {
+                    case "string": {
+                        if (!checkIfPassesStringFilter(row.data[columnName], columnFilterState)) {
+                            return false;
+                        }
+                        break;
+                    }
+                    case "number": {
+                        if (!checkIfPassesNumberFilter(row.data[columnName], columnFilterState)) {
+                            return false;
+                        }
+                        break;
+                    }
+                    default: {
+                        if (!checkIfPassesDateFilter(row.data[columnName], columnFilterState)) {
+                            return false;
+                        }
+                    }
+                }
+            }
+            return true;
+        });
+    }, [rows, filterState]);
+};
+export default useFilter;

package/grid/pipeline/useCombinedPipeline/useFilterStateFromEditable.d.ts

@@ -0,0 +1,4 @@
+import { ColDef } from "../../types";
+import { EditableTableFilterState, TableFilterState } from "../../filtering/types";
+declare const useFilterStateFromEditable: (colDefs: ColDef[], editableFilterState: EditableTableFilterState | null) => TableFilterState | null;
+export default useFilterStateFromEditable;

package/grid/pipeline/useCombinedPipeline/useFilterStateFromEditable.js

@@ -0,0 +1,18 @@
+import { useMemo } from "react";
+var useFilterStateFromEditable = function (colDefs, editableFilterState) {
+    return useMemo(function () {
+        if (editableFilterState === null) {
+            return null;
+        }
+        var filterState = {};
+        colDefs.forEach(function (_a) {
+            var name = _a.name, label = _a.label;
+            filterState[name] = {
+                editableState: editableFilterState[name],
+                label: label,
+            };
+        });
+        return filterState;
+    }, [colDefs, editableFilterState]);
+};
+export default useFilterStateFromEditable;

package/grid/pipeline/useCombinedPipeline/useFilterStateStore.d.ts

@@ -0,0 +1,4 @@
+import { FilterModel, NormalizedTableFilterModel } from "../../filtering/types";
+import { ColDefBase } from "../../types";
+declare const useFilterStateStore: (filterModel: FilterModel | undefined, cols: ColDefBase[]) => NormalizedTableFilterModel | null;
+export default useFilterStateStore;