@mwater/visualization 5.0.0

package/lib/quickfilter/IdArrayQuickfilterComponent.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const R = react_1.default.createElement;
+const expressions_1 = require("@mwater/expressions");
+const expressions_ui_1 = require("@mwater/expressions-ui");
+// Quickfilter for an id[]
+class IdArrayQuickfilterComponent extends react_1.default.Component {
+    render() {
+        // Determine table
+        const exprUtils = new expressions_1.ExprUtils(this.props.schema);
+        const idTable = exprUtils.getExprIdTable(this.props.expr);
+        return R("div", { style: { display: "inline-block", paddingRight: 10 } }, this.props.label ? R("span", { style: { color: "gray" } }, this.props.label + ":\u00a0") : undefined, R("div", { style: { display: "inline-block", minWidth: "280px", verticalAlign: "middle" } }, 
+        // TODO should use quickfilter data source, but is complicated
+        R(expressions_ui_1.IdLiteralComponent, {
+            value: this.props.value,
+            onChange: this.props.onValueChange || (() => { }),
+            idTable,
+            schema: this.props.schema,
+            dataSource: this.props.dataSource,
+            placeholder: "All",
+            multi: this.props.multi
+            // TODO Does not use filters that are passed in
+        })), !this.props.onValueChange ? R("i", { className: "text-warning fa fa-fw fa-lock" }) : undefined);
+    }
+}
+exports.default = IdArrayQuickfilterComponent;

package/lib/quickfilter/Quickfilter.d.ts

@@ -0,0 +1,21 @@
+import { Expr } from "@mwater/expressions";
+/**
+  design is an array of quick filters (user-selectable filters).
+  */
+export interface Quickfilter {
+    /** filter expression (left hand side only. Usually enum, enumset, text, date, datetime, id[], text[]) */
+    expr: Expr;
+    /** optional label */
+    label?: string;
+    /** true to merge on display with the previous quickfilter. Only applicable if previous one has same type and enum values and id table (if applicable) and multi.  */
+    merged?: boolean;
+    /** true for multi-select (text and enum and enumset only) */
+    multi?: boolean;
+}
+/** Lock on a quickfilter */
+export interface QuickfilterLock {
+    /** Expression that is locked to a specific value */
+    expr: Expr;
+    /** Value of the lock */
+    value: any;
+}

package/lib/quickfilter/Quickfilter.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/quickfilter/QuickfilterCompiler.d.ts

@@ -0,0 +1,16 @@
+import { OpExpr, Schema } from "@mwater/expressions";
+import { JsonQLFilter } from "../JsonQLFilter";
+import { Quickfilter, QuickfilterLock } from "./Quickfilter";
+/** Compiles quickfilter values into filters */
+export default class QuickfilterCompiler {
+    schema: Schema;
+    constructor(schema: Schema);
+    /** design is array of quickfilters (see README.md)
+     * values is array of values
+     * locks is array of locked quickfilters. Overrides values
+     * Returns array of filters { table: table id, jsonql: JsonQL with {alias} for the table name to filter by }
+     * See README for values
+     */
+    compile(design: Quickfilter[] | undefined, values: any[] | null, locks: QuickfilterLock[] | null | undefined): JsonQLFilter[];
+    compileToFilterExpr(expr: any, value: any, multi: any): OpExpr | null;
+}

package/lib/quickfilter/QuickfilterCompiler.js

@@ -0,0 +1,167 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_1 = __importDefault(require("lodash"));
+const expressions_1 = require("@mwater/expressions");
+const expressions_2 = require("@mwater/expressions");
+const expressions_3 = require("@mwater/expressions");
+/** Compiles quickfilter values into filters */
+class QuickfilterCompiler {
+    schema;
+    constructor(schema) {
+        this.schema = schema;
+    }
+    /** design is array of quickfilters (see README.md)
+     * values is array of values
+     * locks is array of locked quickfilters. Overrides values
+     * Returns array of filters { table: table id, jsonql: JsonQL with {alias} for the table name to filter by }
+     * See README for values
+     */
+    compile(design, values, locks) {
+        if (!design) {
+            return [];
+        }
+        const filters = [];
+        for (let index = 0; index < design.length; index++) {
+            // Determine if locked
+            var value;
+            var item = design[index];
+            const lock = lodash_1.default.find(locks || [], (lock) => lodash_1.default.isEqual(lock.expr, item.expr));
+            // Determine value
+            if (lock) {
+                ;
+                ({ value } = lock);
+            }
+            else {
+                value = values?.[index];
+            }
+            // Null means no filter
+            if (!value) {
+                continue;
+            }
+            // Clean expression first
+            const expr = new expressions_2.ExprCleaner(this.schema).cleanExpr(item.expr);
+            // Do not render if nothing
+            if (!expr) {
+                continue;
+            }
+            // Due to bug, some quickfilters were merged even though multi was different. Get multi
+            // from original if merged
+            let { multi } = item;
+            if (item.merged) {
+                for (let i = 0, end = index, asc = 0 <= end; asc ? i < end : i > end; asc ? i++ : i--) {
+                    if (!design[i].merged) {
+                        ;
+                        ({ multi } = design[i]);
+                    }
+                }
+            }
+            // Compile to boolean expression
+            const filterExpr = this.compileToFilterExpr(expr, value, multi);
+            const jsonql = new expressions_1.ExprCompiler(this.schema).compileExpr({ expr: filterExpr, tableAlias: "{alias}" });
+            // Only keep if compiles to something
+            if (jsonql == null) {
+                continue;
+            }
+            filters.push({
+                table: expr.table,
+                jsonql
+            });
+        }
+        return filters;
+    }
+    compileToFilterExpr(expr, value, multi) {
+        // Get type of expr
+        const type = new expressions_3.ExprUtils(this.schema).getExprType(expr);
+        const idTable = new expressions_3.ExprUtils(this.schema).getExprIdTable(expr);
+        if (type === "text") {
+            // Create simple = expression
+            if (multi) {
+                return {
+                    type: "op",
+                    op: "= any",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: "text[]", value }]
+                };
+            }
+            else {
+                return {
+                    type: "op",
+                    op: "=",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: "text", value }]
+                };
+            }
+        }
+        else if (type === "enum") {
+            // Create simple = expression
+            if (multi) {
+                return {
+                    type: "op",
+                    op: "= any",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: "enumset", value }]
+                };
+            }
+            else {
+                return {
+                    type: "op",
+                    op: "=",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: "enum", value }]
+                };
+            }
+        }
+        else if (type && ["enumset", "text[]"].includes(type)) {
+            // Create contains expression
+            if (multi) {
+                return {
+                    type: "op",
+                    op: "intersects",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: type, value }]
+                };
+            }
+            else {
+                return {
+                    type: "op",
+                    op: "contains",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: type, value: [value] }]
+                };
+            }
+        }
+        else if (type && ["id[]"].includes(type)) {
+            if (multi) {
+                return {
+                    type: "op",
+                    op: "intersects",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: "id[]", idTable, value }]
+                };
+            }
+            else {
+                return {
+                    type: "op",
+                    op: "contains",
+                    table: expr.table,
+                    exprs: [expr, { type: "literal", valueType: "id[]", idTable, value: [value] }]
+                };
+            }
+        }
+        else if (type && ["date", "datetime"].includes(type) && value.op) {
+            return {
+                type: "op",
+                op: value.op,
+                table: expr.table,
+                exprs: [expr].concat(value.exprs)
+            };
+        }
+        else {
+            return null;
+        }
+    }
+}
+exports.default = QuickfilterCompiler;

package/lib/quickfilter/QuickfilterUtils.d.ts

@@ -0,0 +1,7 @@
+import { DataSource, Expr, Schema } from "@mwater/expressions";
+import { JsonQLFilter } from "..";
+/** Perform query to find quickfilter values for text and text[] expressions
+ * text[] expressions are tricky as they need a special query
+ * In order to filter the text[] queries, filters must use table "value" and filter on no column
+ */
+export declare function findExprValues(expr: Expr, schema: Schema, dataSource: DataSource, filters: JsonQLFilter[] | undefined, offset: number | undefined, limit: number | undefined, callback: (err: any, values?: string[]) => void): void;

package/lib/quickfilter/QuickfilterUtils.js

@@ -0,0 +1,106 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.findExprValues = void 0;
+const lodash_1 = __importDefault(require("lodash"));
+const expressions_1 = require("@mwater/expressions");
+/** Perform query to find quickfilter values for text and text[] expressions
+ * text[] expressions are tricky as they need a special query
+ * In order to filter the text[] queries, filters must use table "value" and filter on no column
+ */
+function findExprValues(expr, schema, dataSource, filters, offset, limit, callback) {
+    const exprCompiler = new expressions_1.ExprCompiler(schema);
+    const exprUtils = new expressions_1.ExprUtils(schema);
+    // Get type of expression
+    const exprType = exprUtils.getExprType(expr);
+    // Table
+    const table = expr.table;
+    let query;
+    if (exprType == "text") {
+        // select distinct <compiled expr> as value from <table> where <filters> order by 1 offset limit
+        query = {
+            type: "query",
+            distinct: true,
+            selects: [{ type: "select", expr: exprCompiler.compileExpr({ expr, tableAlias: "main" }), alias: "value" }],
+            from: exprCompiler.compileTable(table, "main"),
+            where: {
+                type: "op",
+                op: "and",
+                exprs: []
+            },
+            orderBy: [{ ordinal: 1, direction: "asc" }],
+            limit: limit,
+            offset: offset
+        };
+        // Add filters if present
+        for (const filter of filters || []) {
+            if (filter.table == table) {
+                // TODO Type this properly
+                ;
+                query.where.exprs.push((0, expressions_1.injectTableAlias)(filter.jsonql, "main"));
+            }
+        }
+    }
+    else if (exprType == "text[]") {
+        // select distinct value from
+        // <table> as main cross join jsonb_array_elements_text(<compiled expr>) as value
+        // where value like 'abc%'
+        // order by 1
+        query = {
+            type: "query",
+            distinct: true,
+            selects: [{ type: "select", expr: { type: "field", tableAlias: "values" }, alias: "value" }],
+            from: {
+                type: "join",
+                kind: "cross",
+                left: exprCompiler.compileTable(table, "main"),
+                right: {
+                    type: "subexpr",
+                    expr: {
+                        type: "op",
+                        op: "jsonb_array_elements_text",
+                        exprs: [{ type: "op", op: "to_jsonb", exprs: [exprCompiler.compileExpr({ expr, tableAlias: "main" })] }]
+                    },
+                    alias: "values"
+                }
+            },
+            where: {
+                type: "op",
+                op: "and",
+                exprs: []
+            },
+            orderBy: [{ ordinal: 1, direction: "asc" }],
+            limit: limit,
+            offset: offset
+        };
+        // Add filters if present. Value filters must be for pseudo-table "values" on column "value"
+        for (const filter of filters || []) {
+            if (filter.table == table) {
+                // TODO Type this properly
+                ;
+                query.where.exprs.push((0, expressions_1.injectTableAlias)(filter.jsonql, "main"));
+            }
+            if (filter.table == "values") {
+                // TODO Type this properly
+                ;
+                query.where.exprs.push((0, expressions_1.injectTableAlias)(filter.jsonql, "values"));
+            }
+        }
+    }
+    else {
+        return callback(new Error(`Filter type ${exprType} not supported`));
+    }
+    // Execute query
+    dataSource.performQuery(query, (err, rows) => {
+        if (err) {
+            callback(err);
+            return;
+        }
+        // Filter null and blank
+        rows = lodash_1.default.filter(rows, (row) => row.value);
+        callback(null, lodash_1.default.pluck(rows, "value"));
+    });
+}
+exports.findExprValues = findExprValues;

package/lib/quickfilter/QuickfiltersComponent.d.ts

@@ -0,0 +1,293 @@
+import PropTypes from "prop-types";
+import React from "react";
+import { DataSource, LocalizedString, Schema } from "@mwater/expressions";
+import IdArrayQuickfilterComponent from "./IdArrayQuickfilterComponent";
+import { Quickfilter, QuickfilterLock } from "./Quickfilter";
+import { QuickfiltersDataSource } from "./QuickfiltersDataSource";
+import { JsonQLFilter } from "..";
+export interface QuickfiltersComponentProps {
+    /** Design of quickfilters. See README.md */
+    design: Quickfilter[];
+    /** Current values of quickfilters (state of filters selected) */
+    values?: any[];
+    /** Called when value changes */
+    onValuesChange: (values: any[]) => void;
+    locks?: QuickfilterLock[];
+    schema: Schema;
+    dataSource: DataSource;
+    quickfiltersDataSource: QuickfiltersDataSource;
+    /** Filters to add to restrict quick filter data to */
+    filters?: JsonQLFilter[];
+    /** True to hide top border */
+    hideTopBorder?: boolean;
+    /** Called when user hides the quickfilter bar */
+    onHide?: () => void;
+}
+/** Displays quick filters and allows their value to be modified */
+export default class QuickfiltersComponent extends React.Component<QuickfiltersComponentProps> {
+    renderQuickfilter(item: any, index: any): React.CElement<EnumQuickfilterComponentProps, EnumQuickfilterComponent> | React.CElement<TextQuickfilterComponentProps, TextQuickfilterComponent> | React.CElement<DateQuickfilterComponentProps, DateQuickfilterComponent> | React.CElement<import("./IdArrayQuickfilterComponent").IdArrayQuickfilterComponentProps, IdArrayQuickfilterComponent> | null;
+    render(): React.DetailedReactHTMLElement<{
+        style: {
+            borderTop: string | undefined;
+            borderBottom: string;
+            padding: number;
+        };
+    }, HTMLElement> | null;
+}
+interface EnumQuickfilterComponentProps {
+    label?: string;
+    schema: Schema;
+    /** true to display multiple values */
+    multi?: boolean;
+    /** Current value of quickfilter (state of filter selected) */
+    value?: any;
+    /** Called when value changes */
+    onValueChange?: any;
+    options: {
+        /** id of option */
+        id: string;
+        /** localized name */
+        name: LocalizedString;
+    }[];
+}
+/** Quickfilter for an enum */
+declare class EnumQuickfilterComponent extends React.Component<EnumQuickfilterComponentProps> {
+    static contextTypes: {
+        locale: PropTypes.Requireable<string>;
+    };
+    handleSingleChange: (val: any) => any;
+    handleMultiChange: (val: any) => any;
+    renderSingleSelect(options: any[]): React.FunctionComponentElement<Omit<Pick<import("react-select/dist/declarations/src/Select").Props<unknown, boolean, import("react-select").GroupBase<unknown>>, "required" | "id" | "name" | "value" | "form" | "className" | "autoFocus" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "isClearable" | "theme" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputValue" | "inputId" | "instanceId" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom"> & {
+        tabIndex?: number | undefined;
+        options?: import("react-select").OptionsOrGroups<unknown, import("react-select").GroupBase<unknown>> | undefined;
+        placeholder?: React.ReactNode;
+        'aria-live'?: "off" | "assertive" | "polite" | undefined;
+        styles?: import("react-select").StylesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        isLoading?: boolean | undefined;
+        isDisabled?: boolean | undefined;
+        isRtl?: boolean | undefined;
+        isMulti?: boolean | undefined;
+        controlShouldRenderValue?: boolean | undefined;
+        loadingMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        noOptionsMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        backspaceRemovesValue?: boolean | undefined;
+        blurInputOnSelect?: boolean | undefined;
+        captureMenuScroll?: boolean | undefined;
+        classNames?: import("react-select").ClassNamesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        closeMenuOnSelect?: boolean | undefined;
+        closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+        components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<unknown, boolean, import("react-select").GroupBase<unknown>>> | undefined;
+        escapeClearsValue?: boolean | undefined;
+        filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+        formatGroupLabel?: ((group: import("react-select").GroupBase<unknown>) => React.ReactNode) | undefined;
+        getOptionLabel?: import("react-select").GetOptionLabel<unknown> | undefined;
+        getOptionValue?: import("react-select").GetOptionValue<unknown> | undefined;
+        isOptionDisabled?: ((option: unknown, selectValue: import("react-select").Options<unknown>) => boolean) | undefined;
+        isSearchable?: boolean | undefined;
+        minMenuHeight?: number | undefined;
+        maxMenuHeight?: number | undefined;
+        menuIsOpen?: boolean | undefined;
+        menuPlacement?: import("react-select").MenuPlacement | undefined;
+        menuPosition?: import("react-select").MenuPosition | undefined;
+        menuShouldBlockScroll?: boolean | undefined;
+        menuShouldScrollIntoView?: boolean | undefined;
+        openMenuOnFocus?: boolean | undefined;
+        openMenuOnClick?: boolean | undefined;
+        pageSize?: number | undefined;
+        screenReaderStatus?: ((obj: {
+            count: number;
+        }) => string) | undefined;
+        tabSelectsValue?: boolean | undefined;
+        unstyled?: boolean | undefined;
+    } & {}, "value" | "onChange" | "inputValue" | "menuIsOpen" | "onInputChange" | "onMenuOpen" | "onMenuClose"> & Partial<Pick<import("react-select/dist/declarations/src/Select").Props<unknown, boolean, import("react-select").GroupBase<unknown>>, "required" | "id" | "name" | "value" | "form" | "className" | "autoFocus" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "isClearable" | "theme" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputValue" | "inputId" | "instanceId" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom"> & {
+        tabIndex?: number | undefined;
+        options?: import("react-select").OptionsOrGroups<unknown, import("react-select").GroupBase<unknown>> | undefined;
+        placeholder?: React.ReactNode;
+        'aria-live'?: "off" | "assertive" | "polite" | undefined;
+        styles?: import("react-select").StylesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        isLoading?: boolean | undefined;
+        isDisabled?: boolean | undefined;
+        isRtl?: boolean | undefined;
+        isMulti?: boolean | undefined;
+        controlShouldRenderValue?: boolean | undefined;
+        loadingMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        noOptionsMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        backspaceRemovesValue?: boolean | undefined;
+        blurInputOnSelect?: boolean | undefined;
+        captureMenuScroll?: boolean | undefined;
+        classNames?: import("react-select").ClassNamesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        closeMenuOnSelect?: boolean | undefined;
+        closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+        components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<unknown, boolean, import("react-select").GroupBase<unknown>>> | undefined;
+        escapeClearsValue?: boolean | undefined;
+        filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+        formatGroupLabel?: ((group: import("react-select").GroupBase<unknown>) => React.ReactNode) | undefined;
+        getOptionLabel?: import("react-select").GetOptionLabel<unknown> | undefined;
+        getOptionValue?: import("react-select").GetOptionValue<unknown> | undefined;
+        isOptionDisabled?: ((option: unknown, selectValue: import("react-select").Options<unknown>) => boolean) | undefined;
+        isSearchable?: boolean | undefined;
+        minMenuHeight?: number | undefined;
+        maxMenuHeight?: number | undefined;
+        menuIsOpen?: boolean | undefined;
+        menuPlacement?: import("react-select").MenuPlacement | undefined;
+        menuPosition?: import("react-select").MenuPosition | undefined;
+        menuShouldBlockScroll?: boolean | undefined;
+        menuShouldScrollIntoView?: boolean | undefined;
+        openMenuOnFocus?: boolean | undefined;
+        openMenuOnClick?: boolean | undefined;
+        pageSize?: number | undefined;
+        screenReaderStatus?: ((obj: {
+            count: number;
+        }) => string) | undefined;
+        tabSelectsValue?: boolean | undefined;
+        unstyled?: boolean | undefined;
+    } & {}> & import("react-select/dist/declarations/src/useStateManager").StateManagerAdditionalProps<unknown> & React.RefAttributes<import("react-select/dist/declarations/src/Select").default<unknown, boolean, import("react-select").GroupBase<unknown>>>>;
+    renderMultiSelect(options: any[]): React.FunctionComponentElement<Omit<Pick<import("react-select/dist/declarations/src/Select").Props<unknown, boolean, import("react-select").GroupBase<unknown>>, "required" | "id" | "name" | "value" | "form" | "className" | "autoFocus" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "isClearable" | "theme" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputValue" | "inputId" | "instanceId" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom"> & {
+        tabIndex?: number | undefined;
+        options?: import("react-select").OptionsOrGroups<unknown, import("react-select").GroupBase<unknown>> | undefined;
+        placeholder?: React.ReactNode;
+        'aria-live'?: "off" | "assertive" | "polite" | undefined;
+        styles?: import("react-select").StylesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        isLoading?: boolean | undefined;
+        isDisabled?: boolean | undefined;
+        isRtl?: boolean | undefined;
+        isMulti?: boolean | undefined;
+        controlShouldRenderValue?: boolean | undefined;
+        loadingMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        noOptionsMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        backspaceRemovesValue?: boolean | undefined;
+        blurInputOnSelect?: boolean | undefined;
+        captureMenuScroll?: boolean | undefined;
+        classNames?: import("react-select").ClassNamesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        closeMenuOnSelect?: boolean | undefined;
+        closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+        components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<unknown, boolean, import("react-select").GroupBase<unknown>>> | undefined;
+        escapeClearsValue?: boolean | undefined;
+        filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+        formatGroupLabel?: ((group: import("react-select").GroupBase<unknown>) => React.ReactNode) | undefined;
+        getOptionLabel?: import("react-select").GetOptionLabel<unknown> | undefined;
+        getOptionValue?: import("react-select").GetOptionValue<unknown> | undefined;
+        isOptionDisabled?: ((option: unknown, selectValue: import("react-select").Options<unknown>) => boolean) | undefined;
+        isSearchable?: boolean | undefined;
+        minMenuHeight?: number | undefined;
+        maxMenuHeight?: number | undefined;
+        menuIsOpen?: boolean | undefined;
+        menuPlacement?: import("react-select").MenuPlacement | undefined;
+        menuPosition?: import("react-select").MenuPosition | undefined;
+        menuShouldBlockScroll?: boolean | undefined;
+        menuShouldScrollIntoView?: boolean | undefined;
+        openMenuOnFocus?: boolean | undefined;
+        openMenuOnClick?: boolean | undefined;
+        pageSize?: number | undefined;
+        screenReaderStatus?: ((obj: {
+            count: number;
+        }) => string) | undefined;
+        tabSelectsValue?: boolean | undefined;
+        unstyled?: boolean | undefined;
+    } & {}, "value" | "onChange" | "inputValue" | "menuIsOpen" | "onInputChange" | "onMenuOpen" | "onMenuClose"> & Partial<Pick<import("react-select/dist/declarations/src/Select").Props<unknown, boolean, import("react-select").GroupBase<unknown>>, "required" | "id" | "name" | "value" | "form" | "className" | "autoFocus" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "isClearable" | "theme" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputValue" | "inputId" | "instanceId" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom"> & {
+        tabIndex?: number | undefined;
+        options?: import("react-select").OptionsOrGroups<unknown, import("react-select").GroupBase<unknown>> | undefined;
+        placeholder?: React.ReactNode;
+        'aria-live'?: "off" | "assertive" | "polite" | undefined;
+        styles?: import("react-select").StylesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        isLoading?: boolean | undefined;
+        isDisabled?: boolean | undefined;
+        isRtl?: boolean | undefined;
+        isMulti?: boolean | undefined;
+        controlShouldRenderValue?: boolean | undefined;
+        loadingMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        noOptionsMessage?: ((obj: {
+            inputValue: string;
+        }) => React.ReactNode) | undefined;
+        backspaceRemovesValue?: boolean | undefined;
+        blurInputOnSelect?: boolean | undefined;
+        captureMenuScroll?: boolean | undefined;
+        classNames?: import("react-select").ClassNamesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+        closeMenuOnSelect?: boolean | undefined;
+        closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+        components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<unknown, boolean, import("react-select").GroupBase<unknown>>> | undefined;
+        escapeClearsValue?: boolean | undefined;
+        filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+        formatGroupLabel?: ((group: import("react-select").GroupBase<unknown>) => React.ReactNode) | undefined;
+        getOptionLabel?: import("react-select").GetOptionLabel<unknown> | undefined;
+        getOptionValue?: import("react-select").GetOptionValue<unknown> | undefined;
+        isOptionDisabled?: ((option: unknown, selectValue: import("react-select").Options<unknown>) => boolean) | undefined;
+        isSearchable?: boolean | undefined;
+        minMenuHeight?: number | undefined;
+        maxMenuHeight?: number | undefined;
+        menuIsOpen?: boolean | undefined;
+        menuPlacement?: import("react-select").MenuPlacement | undefined;
+        menuPosition?: import("react-select").MenuPosition | undefined;
+        menuShouldBlockScroll?: boolean | undefined;
+        menuShouldScrollIntoView?: boolean | undefined;
+        openMenuOnFocus?: boolean | undefined;
+        openMenuOnClick?: boolean | undefined;
+        pageSize?: number | undefined;
+        screenReaderStatus?: ((obj: {
+            count: number;
+        }) => string) | undefined;
+        tabSelectsValue?: boolean | undefined;
+        unstyled?: boolean | undefined;
+    } & {}> & import("react-select/dist/declarations/src/useStateManager").StateManagerAdditionalProps<unknown> & React.RefAttributes<import("react-select/dist/declarations/src/Select").default<unknown, boolean, import("react-select").GroupBase<unknown>>>>;
+    render(): React.DetailedReactHTMLElement<{
+        style: {
+            display: "inline-block";
+            paddingRight: number;
+        };
+    }, HTMLElement>;
+}
+interface TextQuickfilterComponentProps {
+    label: string;
+    schema: Schema;
+    /** See QuickfiltersDataSource */
+    quickfiltersDataSource: QuickfiltersDataSource;
+    expr: any;
+    index: number;
+    /** Current value of quickfilter (state of filter selected) */
+    value?: any;
+    /** Called when value changes */
+    onValueChange?: any;
+    /** true to display multiple values */
+    multi?: boolean;
+    /** Filters to add to restrict quick filter data to */
+    filters?: JsonQLFilter[];
+}
+declare class TextQuickfilterComponent extends React.Component<TextQuickfilterComponentProps> {
+    render(): React.DetailedReactHTMLElement<{
+        style: {
+            display: "inline-block";
+            paddingRight: number;
+        };
+    }, HTMLElement>;
+}
+interface DateQuickfilterComponentProps {
+    label?: string;
+    schema: Schema;
+    expr: any;
+    /** Current value of quickfilter (state of filter selected) */
+    value?: any;
+    onValueChange: any;
+}
+declare class DateQuickfilterComponent extends React.Component<DateQuickfilterComponentProps> {
+    render(): React.DetailedReactHTMLElement<{
+        style: {
+            display: "inline-block";
+            paddingRight: number;
+        };
+    }, HTMLElement>;
+}
+export {};