react-gridix 0.2.4 → 0.2.6

package/dist/index.d.ts

@@ -169,6 +169,16 @@ export declare interface ColumnDef<T = Record<string, any>> {
      * Overrides the grid's `filterDebounce`. Use 0 to apply on every keystroke.
      */
     filterDebounce?: number;
+    /**
+     * Adds a drop-down at the top of this column's filter popup for choosing how the text is compared:
+     * contains, does not contain, equals, not equal, starts with, does not start with, ends with, does not
+     * end with. Default false: the column then simply filters with "contains" and shows no drop-down.
+     * Pass `true` for all eight, or a list to offer only some, for example `["contains", "equals", "startsWith"]`.
+     * Applies to text columns (`filterType` `"text"` or `"exact"`); it has no effect on number, date or select filters.
+     */
+    filterOperators?: boolean | TextFilterOperator[];
+    /** The comparison that is selected first when `filterOperators` is on. Default `"contains"` (`"equals"` for `filterType: "exact"`). */
+    filterOperator?: TextFilterOperator;
     /** A React component drawn instead of the default dot. Receives `{ column, active, open }`. */
     filterIndicator?: ComponentType<FilterIndicatorProps<T>>;
     /** Classes for this column's filter indicator button (Tailwind works). */
@@ -210,6 +220,8 @@ export declare interface ColumnDef<T = Record<string, any>> {
     cellEditor?: ComponentType<CellEditorProps<T>>;
     /** A React component that renders the header label (the filter indicator and sort arrow are still added). */
     headerRenderer?: ComponentType<HeaderRendererProps<T>>;
+    /** The sort indicator of this column. Overrides the grid's `sortIndicator`. See {@link DataGridProps.sortIndicator}. */
+    sortIndicator?: SortIndicatorSetting<T>;
     /** Classes for the whole column: its header cell and every body cell. Tailwind works. */
     className?: string;
     /** Inline styles for the whole column: its header cell and every body cell. */
@@ -229,7 +241,7 @@ export declare interface ColumnDef<T = Record<string, any>> {
     headerCheckbox?: boolean;
 }
 
-export declare function DataGrid<T extends AnyRow = AnyRow>({ columns, rows, getRowId, editable, enterMovesDown, onCellEdit, onRowsChange, rowSelection, selectedRowIds, defaultSelectedRowIds, onSelectionChange, isRowSelectable, sort: sortProp, defaultSort, onSortChange, multiSort, searchable, searchPlaceholder, search: searchProp, onSearchChange, filters: filtersProp, onFiltersChange, pagination, paginationPosition, showToolbar: allowToolbar, showFooter, pageSize: initialPageSize, pageSizeOptions, page: pageProp, onPageChange, onPageSizeChange, serverSide, rowCount, onQueryChange, queryDebounce, filterDebounce, loading: loadingProp, loadingRows, skeletonRow, errorMessage, columnMenu, onColumnVisibilityChange, keyboardNavigation, virtualize, rowHeight, overscan, exportable, apiRef, onRowClick, toolbar, emptyMessage, striped, stripeColors, checkboxVariant, animateRows, rowAnimationClassName, theme, maxHeight, className, style, classNames, styles, rowClassName, rowStyle, }: DataGridProps<T>): JSX_2.Element;
+export declare function DataGrid<T extends AnyRow = AnyRow>({ columns, rows, getRowId, editable, enterMovesDown, onCellEdit, onRowsChange, rowSelection, selectedRowIds, defaultSelectedRowIds, onSelectionChange, isRowSelectable, sort: sortProp, defaultSort, onSortChange, multiSort, searchable, searchPlaceholder, search: searchProp, onSearchChange, filters: filtersProp, onFiltersChange, pagination, paginationPosition, showToolbar: allowToolbar, showFooter, pageSize: initialPageSize, pageSizeOptions, page: pageProp, onPageChange, onPageSizeChange, serverSide, rowCount, onQueryChange, queryDebounce, filterDebounce, loading: loadingProp, loadingRows, skeletonRow, errorMessage, columnMenu, onColumnVisibilityChange, keyboardNavigation, virtualize, rowHeight, overscan, exportable, onExportError, apiRef, onRowClick, toolbar, emptyMessage, emptyComponent, sortIndicator, striped, stripeColors, checkboxVariant, animateRows, rowAnimation, rowAnimationDuration, rowAnimationStagger, rowAnimationClassName, rowExitAnimationClassName, theme, maxHeight, className, style, classNames, styles, rowClassName, rowStyle, }: DataGridProps<T>): JSX_2.Element;
 
 /** Methods you can call from outside by passing a ref as `apiRef`. */
 export declare interface DataGridApi<T = Record<string, any>> {
@@ -237,6 +249,20 @@ export declare interface DataGridApi<T = Record<string, any>> {
     getCsv: (options?: ExportOptions) => string;
     /** Downloads a CSV file (opens the browser's save dialog). */
     exportCsv: (options?: ExportOptions) => void;
+    /** Builds the JSON text (an array of objects) without downloading it. */
+    getJson: (options?: ExportOptions) => string;
+    /** Downloads a `.json` file. */
+    exportJson: (options?: ExportOptions) => void;
+    /** Builds an Excel (`.xlsx`) file in memory. */
+    getXlsx: (options?: ExportOptions) => Promise<Blob>;
+    /** Downloads an `.xlsx` file. */
+    exportXlsx: (options?: ExportOptions) => Promise<void>;
+    /** Builds a PDF in memory. Needs `jspdf` and `jspdf-autotable` (and `html2canvas` for header/footer elements). */
+    getPdf: (options?: ExportOptions) => Promise<Blob>;
+    /** Downloads a `.pdf` file. */
+    exportPdf: (options?: ExportOptions) => Promise<void>;
+    /** Exports in the given format: the same as calling the method above for it. */
+    exportAs: (format: ExportFormat, options?: ExportOptions) => Promise<void>;
     getSelectedRows: () => T[];
     getSelectedRowIds: () => (string | number)[];
     /** Selects every selectable row that matches the search and filters. */
@@ -363,22 +389,60 @@ export declare interface DataGridProps<T = Record<string, any>> {
     rowHeight?: number;
     /** Extra rows rendered above and below the visible ones when `virtualize` is on. Default 6. */
     overscan?: number;
-    /** Show an "Export CSV" button. Pass an object to set the file name, scope and so on. Default false. */
+    /**
+     * Show an export button in the toolbar. `true` gives "Export CSV". Pass an object to set the file name,
+     * scope and so on, and `formats: ["csv", "xlsx", "json", "pdf"]` to offer more formats in an "Export" menu. Default false.
+     */
     exportable?: boolean | ExportOptions;
+    /** Called when an export fails (for example `jspdf` is not installed). Without it the error is logged to the console. */
+    onExportError?: (error: Error, format: ExportFormat) => void;
     /** Pass a ref to call methods such as `exportCsv()` or `getSelectedRows()` from outside. */
     apiRef?: MutableRefObject<DataGridApi<T> | null>;
     onRowClick?: (row: T, rowIndex: number) => void;
     /** Extra content on the right side of the toolbar. */
     toolbar?: ReactNode;
     emptyMessage?: ReactNode;
+    /**
+     * A component drawn instead of the `emptyMessage` text when there are no rows to show. It receives
+     * `{ reason, search, filters, columns, clearAll }`, so it can say "nothing matches" and offer a button
+     * that clears the filters. Define it outside render so it keeps its identity.
+     */
+    emptyComponent?: ComponentType<EmptyStateProps<T>>;
+    /**
+     * The arrow shown in sortable headers. `"default"` (the little ▲ ▼ ↕ text arrows), `"arrow"` (a smooth
+     * arrow that turns around when the sort changes), or your own component, which receives
+     * `{ column, direction, priority }`. A column can override it with its own `sortIndicator`.
+     */
+    sortIndicator?: SortIndicatorSetting<T>;
     /** Alternate row shading. Default false. */
     striped?: boolean;
     /** Two colours for the alternating rows, for example `["#ffffff", "#f1f5f9"]`. Implies `striped`. */
     stripeColors?: [string, string];
     /** Checkbox style for `type: "boolean"` columns and the selection column: "button", "tick" or "native" (default). */
     checkboxVariant?: CheckboxVariant;
-    /** Rows slide in smoothly when they render (new page, sort, search). Default true. Respects "reduce motion". */
+    /**
+     * Rows animate when they come and go. Default true. Respects "reduce motion".
+     * Rows are matched by `getRowId`: a row that stays on screen is left alone while new rows animate in
+     * and are added to the list, and a row that goes away animates out where it was.
+     */
     animateRows?: boolean;
+    /**
+     * Which animation rows use: one name for both directions (`"zoom"`), or `{ enter, exit }` to mix
+     * (`{ enter: "slide-right", exit: "fade" }`). See {@link RowAnimationName}. Default `"slide-up"`.
+     */
+    rowAnimation?: RowAnimationName | {
+        enter?: RowAnimationName;
+        exit?: RowAnimationName;
+    };
+    /** Length of the enter animation in milliseconds (exit takes 80% of it). Default 380. */
+    rowAnimationDuration?: number;
+    /** Delay between rows that appear together, in milliseconds. Use 0 to start all at once. Default 28. */
+    rowAnimationStagger?: number;
+    /**
+     * Your own CSS class (or function) for the animation of a row that leaves, like `rowAnimationClassName`
+     * is for rows that arrive. The class should set `animation` and keep the final state (`forwards`).
+     */
+    rowExitAnimationClassName?: string | ((row: T, rowIndex: number) => string);
     /**
      * Your own CSS class (or a function returning one) for the entrance animation of every row. It
      * replaces the built-in slide-up. The class should set `animation`. Each row also has the CSS
@@ -412,21 +476,59 @@ export declare interface DateRangeFilter {
     to?: string;
 }
 
+/** Why the grid has no rows to show. */
+export declare type EmptyReason = "no-data" | "no-results";
+
+/** Props received by the `emptyComponent`, drawn in place of the "No rows to show" message. */
+export declare interface EmptyStateProps<T = Record<string, any>> {
+    /**
+     * `"no-data"`: the grid was given no rows at all.
+     * `"no-results"`: there are rows, but the search or the filters hide all of them.
+     */
+    reason: EmptyReason;
+    /** The global search text (empty when none). */
+    search: string;
+    /** The filters that are active right now, by field. */
+    filters: Record<string, FilterValue>;
+    /** The columns that are visible. */
+    columns: ColumnDef<T>[];
+    /** Clears the search box and every filter, which brings the rows back. */
+    clearAll: () => void;
+}
+
+/** The file formats the grid can export. */
+export declare type ExportFormat = "csv" | "xlsx" | "json" | "pdf";
+
 export declare interface ExportOptions {
     /** File name without the extension. Default `"export"`. */
     filename?: string;
     /**
      * Which rows to export.
      * - `"filtered"` (default): every row matching the search and filters, across all pages
-     * - `"page"`    : only the rows on the current page
-     * - `"selected"`: only the selected rows
+     * - `"visible"` : the rows you can see now, which is the current page (every matching row when there is no pagination)
+     * - `"page"`    : same as `"visible"`
+     * - `"selected"`: only the selected rows (needs `rowSelection`)
      * With `serverSide`, "filtered" means the rows currently loaded.
      */
-    scope?: "filtered" | "page" | "selected";
+    scope?: "filtered" | "visible" | "page" | "selected";
     /** Also export columns the user has hidden. Default false. */
     includeHidden?: boolean;
-    /** Add an apostrophe in front of text that starts with `= + - @`, so spreadsheets do not run it as a formula. Default true. */
+    /** CSV only: add an apostrophe in front of text that starts with `= + - @`, so spreadsheets do not run it as a formula. Default true. */
     sanitize?: boolean;
+    /**
+     * Which formats the toolbar export button offers. One format (the default, `["csv"]`) gives a plain
+     * "Export CSV" button; several give an "Export" menu with a format list and, when more than one choice
+     * makes sense, a "Visible rows / Selected rows / All matching rows" chooser.
+     */
+    formats?: ExportFormat[];
+    /** Excel only: name of the worksheet. Default `"Sheet1"`. */
+    sheetName?: string;
+    /** JSON only: use the column `"field"` (default) or its `"header"` text as the key of each value. */
+    jsonKeys?: "field" | "header";
+    /** JSON only: spaces of indentation. Default 2; use 0 for one compact line. */
+    jsonIndent?: number;
+    /** PDF only: header, footer, paper and table settings. */
+    pdf?: PdfExportOptions;
 }
 
 /**
@@ -474,7 +576,7 @@ export declare interface FilterRendererProps<T = Record<string, any>> {
 export declare type FilterType = "text" | "exact" | "number" | "date" | "select";
 
 /** What a column's filter currently holds. The shape depends on the column's `FilterType`. */
-export declare type FilterValue = string | NumberRangeFilter | DateRangeFilter | string[];
+export declare type FilterValue = string | TextFilter | NumberRangeFilter | DateRangeFilter | string[];
 
 /**
  * Everything the grid wants from your server in `serverSide` mode. It is sent to `onQueryChange`
@@ -492,7 +594,7 @@ export declare interface GridQuery {
     pageSize: number;
 }
 
-export declare type GridSlot = "root" | "toolbar" | "search" | "scroll" | "table" | "thead" | "headerRow" | "headerCell" | "filterIndicator" | "filterPopup" | "filterInput" | "tbody" | "row" | "cell" | "editor" | "empty" | "footer" | "rowCount" | "pageInfo" | "pageSize" | "pagination" | "pageButton" | "checkbox" | "checkboxControl" | "checkboxIndicator" | "toolButton" | "skeleton";
+export declare type GridSlot = "root" | "toolbar" | "search" | "scroll" | "table" | "thead" | "headerRow" | "headerCell" | "filterIndicator" | "filterPopup" | "filterInput" | "tbody" | "row" | "cell" | "editor" | "empty" | "footer" | "rowCount" | "pageInfo" | "pageSize" | "pagination" | "pageButton" | "checkbox" | "checkboxControl" | "checkboxIndicator" | "toolButton" | "exportMenu" | "sortIndicator" | "skeleton";
 
 /**
  * Built-in themes. A theme only applies when you pass its name to `<DataGrid theme="..." />`.
@@ -517,10 +619,174 @@ export declare interface NumberRangeFilter {
 
 export declare type PaginationPosition = "bottom" | "top" | "both";
 
+/** A CSS colour: `"#4f46e5"`, `"#fff"`, `"rgb(79, 70, 229)"`, `"rgba(0,0,0,.5)"` or a name like `"tomato"`. */
+export declare type PdfColor = string;
+
+/** Looks of one column in the PDF, by the column's `field` (see `PdfStyle.columns`). */
+export declare interface PdfColumnStyle {
+    /** Column width in points, or `"auto"` (default), or `"wrap"` (as narrow as the longest word allows). */
+    width?: number | "auto" | "wrap";
+    align?: "left" | "center" | "right";
+    textColor?: PdfColor;
+    backgroundColor?: PdfColor;
+    fontStyle?: "normal" | "bold" | "italic" | "bolditalic";
+    fontSize?: number;
+}
+
+/** Options of a PDF export (the `pdf` field of {@link ExportOptions}). */
+export declare interface PdfExportOptions {
+    /**
+     * Where the PDF libraries come from. Required for PDF export. Give the libraries, or a function that loads
+     * them (best: it runs only when someone exports a PDF):
+     *
+     *     libraries: async () => ({
+     *       jsPDF: (await import("jspdf")).jsPDF,
+     *       autoTable: (await import("jspdf-autotable")).default,
+     *       html2canvas: (await import("html2canvas")).default, // only for a header / footer element
+     *     })
+     */
+    libraries?: PdfLibraries | (() => PdfLibraries | Promise<PdfLibraries>);
+    /**
+     * A heading printed above the table on the first page: a string, or a React element (drawn to a picture
+     * like `header` and `footer`, so it needs `html2canvas` in `libraries`).
+     */
+    title?: ReactNode;
+    /**
+     * Printed at the top of every page. A string (tokens `{page}`, `{pages}` and `{date}` are replaced), or a
+     * React element such as `<div style={{display:"flex"}}><img src={logo} height={32}/> Sales report</div>`.
+     * An element is drawn to an image first (with html2canvas), so styled boxes, colours and images work.
+     */
+    header?: ReactNode;
+    /** Printed at the bottom of every page. Same rules as `header`. */
+    footer?: ReactNode;
+    /** Where the header goes horizontally. Default `"left"`. */
+    headerAlign?: "left" | "center" | "right";
+    /** Where the footer goes horizontally. Default `"center"`. */
+    footerAlign?: "left" | "center" | "right";
+    /** `"auto"` (default) picks landscape when the table has more than 6 columns. */
+    orientation?: "portrait" | "landscape" | "auto";
+    /** Paper size. Default `"a4"`. */
+    pageSize?: "a3" | "a4" | "a5" | "letter" | "legal";
+    /**
+     * Space around the page in points (1 pt = 1/72 inch). A number for all four sides, or
+     * `{ top, right, bottom, left }` (a missing side uses 36). Default 36.
+     */
+    margin?: number | {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    /** Font size of the table text in points. Default 9. */
+    fontSize?: number;
+    /** Look of the table: `"striped"` (default), `"grid"` or `"plain"`. */
+    tableTheme?: "striped" | "grid" | "plain";
+    /** Background colour of the table's header row, as a hex string. Default `"#4f46e5"`. Same as `style.headColor`. */
+    headColor?: string;
+    /** Text colour of the table's header row. Default `"#ffffff"`. Same as `style.headTextColor`. */
+    headTextColor?: string;
+    /**
+     * Copy the look of the grid on screen into the PDF: header colours, the two row stripe colours, text
+     * colour, row borders, text size and the grid's background. It reads the real elements, so it follows your
+     * theme, Tailwind classes and CSS. Default false (the PDF then uses its own look). Anything you set
+     * yourself in `style` or the options above wins over the copied value.
+     */
+    matchGridStyle?: boolean;
+    /** Colours, borders, padding and more for the table and the page. See {@link PdfStyle}. */
+    style?: PdfStyle;
+    /**
+     * Extra options for jspdf-autotable, merged in last so they override everything above. For anything this
+     * list does not cover: `{ rowPageBreak: "avoid", didParseCell: (data) => { ... } }`.
+     */
+    autoTableOptions?: Record<string, any>;
+    /** Print "Page 1 of 3" in the bottom right corner. Default true. */
+    pageNumbers?: boolean;
+    /** Tallest a header or footer image may be, in points. Default 90. */
+    maxImageHeight?: number;
+    /**
+     * Name of a font you registered with jsPDF (`doc.addFileToVFS` / `doc.addFont`) in `beforeRender`.
+     * jsPDF's built-in fonts only cover Western European letters, so register one for other alphabets.
+     */
+    fontName?: string;
+    /** Called with the jsPDF document before anything is drawn, so you can register fonts or set document properties. */
+    beforeRender?: (doc: any) => void | Promise<void>;
+}
+
+/**
+ * The PDF libraries, handed to the grid by your app (see `PdfExportOptions.libraries`). The grid does not
+ * import them itself, so apps that never export a PDF need not install them.
+ */
+export declare interface PdfLibraries {
+    /** The `jsPDF` class from `jspdf`. */
+    jsPDF: any;
+    /** The `autoTable` function from `jspdf-autotable` (its default export). */
+    autoTable: any;
+    /** The `html2canvas` function. Only needed when the header or footer is a React element. */
+    html2canvas?: any;
+}
+
+/** Padding inside table cells, in points: one number, or one per side. */
+export declare type PdfPadding = number | {
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+};
+
+/** How the PDF's table and page look. Every field is optional. */
+export declare interface PdfStyle {
+    /** Header row background. Default `"#4f46e5"`. */
+    headColor?: PdfColor;
+    /** Header row text colour. Default white. */
+    headTextColor?: PdfColor;
+    /** Header row text size in points. Default: the table's `fontSize`. */
+    headFontSize?: number;
+    /** Header row font style. Default `"bold"`. */
+    headFontStyle?: "normal" | "bold" | "italic" | "bolditalic";
+    /** Background of body rows (when no `stripeColors`). Default: none (white page). */
+    bodyColor?: PdfColor;
+    /** Text colour of body rows. */
+    bodyTextColor?: PdfColor;
+    /** The two colours rows alternate between, starting with the first: `["#ffffff", "#f1f5f9"]`. */
+    stripeColors?: [PdfColor, PdfColor];
+    /** Colour of the lines between cells. */
+    borderColor?: PdfColor;
+    /** Thickness of those lines in points (0.5 is thin). Default: the table theme's. */
+    borderWidth?: number;
+    /** Space inside each cell, in points. Default 4. */
+    cellPadding?: PdfPadding;
+    /** Smallest height of a row in points. */
+    minRowHeight?: number;
+    /** Table text size in points. Default 9 (the `fontSize` option does the same). */
+    fontSize?: number;
+    /** Font registered with jsPDF (the `fontName` option does the same). */
+    fontName?: string;
+    /** Colour behind everything on every page, for example `"#0f172a"`. Default: white paper. Text colours adapt when it is dark. */
+    pageBackground?: PdfColor;
+    /** Colour of the header, footer and page-number text. Default grey, or light on a dark `pageBackground`. */
+    textColor?: PdfColor;
+    /** Colour of the `title`. Default near black, or light on a dark `pageBackground`. */
+    titleColor?: PdfColor;
+    /** Size of the `title` in points. Default 14. */
+    titleSize?: number;
+    /** Margins of the page (the `margin` option does the same). */
+    margin?: PdfExportOptions["margin"];
+    /** Per column, by the column's `field`: width, alignment, colours, font. */
+    columns?: Record<string, PdfColumnStyle>;
+}
+
 declare type Prev = [never, 0, 1, 2, 3, 4, 5];
 
 declare type Primitive = string | number | boolean | bigint | symbol | null | undefined | Date | ((...args: any[]) => any);
 
+/**
+ * Entrance / exit animations a row can use. Every name has an "in" version (a row appears) and an
+ * "out" version (a row leaves).
+ * `"fade"`, `"slide-up"`, `"slide-down"`, `"slide-left"`, `"slide-right"`, `"zoom"`, `"flip-x"`, `"flip-y"`,
+ * `"rotate"`, `"skew"`, `"blur"`, `"bounce"` and `"none"`.
+ */
+export declare type RowAnimationName = "fade" | "slide-up" | "slide-down" | "slide-left" | "slide-right" | "zoom" | "flip-x" | "flip-y" | "rotate" | "skew" | "blur" | "bounce" | "none";
+
 /** The selected rows. `rows` only holds rows that are loaded in the grid right now (matters with `serverSide`). */
 export declare interface RowSelection<T> {
     ids: (string | number)[];
@@ -538,12 +804,68 @@ export declare interface SkeletonRowProps<T = Record<string, any>> {
     columns: ColumnDef<T>[];
 }
 
+/**
+ * An arrow that turns around smoothly when the sort changes.
+ *
+ * Ascending points up, descending points down, and "not sorted" is a dim up arrow. The arrow always
+ * keeps turning the same way (up -> down -> back up) instead of spinning backwards, so the movement
+ * reads as one continuous half-turn per click. Use it in a column with `sortIndicator="arrow"`, or put
+ * it inside your own `sortIndicator` component:
+ *
+ *     const MyIndicator = ({ direction }) => <SortArrow direction={direction} size={16} />;
+ *
+ * The turn is a CSS transition (`--rg-sort-turn`, default 0.28s) and is switched off for people who
+ * prefer reduced motion.
+ */
+export declare function SortArrow({ direction, size, priority, className, style }: SortArrowProps): JSX_2.Element;
+
+export declare interface SortArrowProps {
+    /** Direction the column is sorted in, or null when it is not sorted. */
+    direction: SortDirection | null;
+    /** Size of the arrow in pixels. Default 14. */
+    size?: number;
+    /** Position of the column in a multi-column sort. Shown as a small number next to the arrow. */
+    priority?: number;
+    className?: string;
+    style?: CSSProperties;
+}
+
 export declare type SortDirection = "asc" | "desc";
 
+/** Props received by a `sortIndicator` component: the little arrow next to a sortable header's name. */
+export declare interface SortIndicatorProps<T = Record<string, any>> {
+    column: ColumnDef<T>;
+    /** Direction this column is sorted in, or null when it is not sorted. */
+    direction: SortDirection | null;
+    /** Position of this column in a multi-column sort (1, 2, ...), or undefined when only one column is sorted. */
+    priority?: number;
+}
+
+/** What can be given as a `sortIndicator`: a built-in name or your own component. */
+export declare type SortIndicatorSetting<T = Record<string, any>> = "default" | "arrow" | ComponentType<SortIndicatorProps<T>>;
+
 /** One sorted column. The grid keeps a list of these (more than one only with `multiSort`). */
 export declare interface SortModel {
     field: string;
     direction: SortDirection;
 }
 
+/**
+ * Value of a text filter whose column has `filterOperators` switched on: the chosen comparison plus the
+ * typed text. (Without `filterOperators` a text filter is just the string.)
+ */
+export declare interface TextFilter {
+    operator: TextFilterOperator;
+    value: string;
+}
+
+/**
+ * How a text filter compares the typed text with the cell's displayed text (ignoring case):
+ * - `"contains"` / `"notContains"`         : the text appears anywhere in the cell (or does not)
+ * - `"equals"` / `"notEquals"`             : the whole cell is the text (or is not)
+ * - `"startsWith"` / `"notStartsWith"`     : the cell begins with the text (or does not)
+ * - `"endsWith"` / `"notEndsWith"`         : the cell ends with the text (or does not)
+ */
+export declare type TextFilterOperator = "contains" | "notContains" | "equals" | "notEquals" | "startsWith" | "notStartsWith" | "endsWith" | "notEndsWith";
+
 export { }