@addev-be/ui 1.0.1 → 1.1.0

package/src/components/data/DataGrid/types.ts

@@ -1,372 +1,372 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
-import { z } from 'zod';
-
-import {
-  CSSProperties,
-  Context,
-  Dispatch,
-  FC,
-  MouseEvent,
-  MouseEventHandler,
-  ReactNode,
-  SetStateAction,
-} from 'react';
-
-import { DataGridEditableCellFC } from './DataGridEditableCell/types';
-import { SpaceProps } from '../../../helpers/styled';
-import { ThemeColor } from '../../../providers/ThemeProvider/types';
-
-export type DataGridCellFCProps = {
-  onDoubleClick?: MouseEventHandler;
-  style?: CSSProperties;
-  $color?: ThemeColor;
-  $textAlign?: 'left' | 'right' | 'center';
-  $userSelect?: boolean;
-  $headerColor?: ThemeColor;
-};
-
-export type DataGridCellFC = FC<DataGridCellFCProps>;
-
-export type DataGridFooterPredefinedFunction =
-  | 'average'
-  | 'avg'
-  | 'count'
-  | 'max'
-  | 'min'
-  | 'sum';
-export type DataGridFooterFunction<R> = (
-  allRows: R[],
-  filteredRows: R[],
-  selectedRows: R[]
-) => ReactNode;
-
-type ExcelOptions = {
-  formatter?: (value: any) => string;
-  colorGetter?: (value: any) => string;
-  valueGetter?: (value: any) => string;
-};
-
-type CommonGridColumnProps<R, T> = {
-  key: string;
-  component?: DataGridCellFC;
-  color?: ThemeColor;
-  excelOptions?: ExcelOptions;
-  textAlign?: 'left' | 'right' | 'center';
-  filter?: DataGridFilter;
-  footer?:
-    | DataGridFooterFunction<R>
-    | Record<string, DataGridFooterFunction<R> | null>;
-  name: ReactNode;
-  order?: number;
-  getter: (row: R) => T;
-  render?: (
-    value: T,
-    row: R,
-    column: CommonGridColumnProps<R, T>
-  ) => ReactNode | string;
-  resizable?: boolean;
-  sortGetter?: (row: R) => string | number;
-  width?: number;
-};
-
-export type EditableDataGridColumn<R, T> = CommonGridColumnProps<R, T> & {
-  editable?: boolean;
-  editComponent?: DataGridEditableCellFC<R, T>;
-  itemToPartialRow?: (key: string, row: R, value: T) => Partial<R>;
-};
-
-export type DataGridTextColumn<R> = EditableDataGridColumn<R, string> & {
-  type: 'text';
-};
-
-export type DataGridNumberColumn<R> = EditableDataGridColumn<R, number> & {
-  type: 'number';
-  decimals?: number;
-  currency?: string | ((row: R) => string);
-  prefix?: string;
-  suffix?: string;
-};
-
-export type DataGridDateColumn<R> = EditableDataGridColumn<R, string> & {
-  type: 'date';
-};
-
-export type DataGridCheckboxColumn<R> = EditableDataGridColumn<R, boolean> & {
-  type: 'checkbox';
-};
-
-export type DataGridSelectColumn<R, T = any> = EditableDataGridColumn<
-  R,
-  T | null
-> & {
-  type: 'select';
-  items: T[];
-  itemKey: (item: T) => string;
-  itemLabel: (item: T) => string;
-};
-
-export type DataGridForeignListColumn<R> = EditableDataGridColumn<
-  R,
-  string | null
-> & {
-  type: 'foreignList';
-};
-
-export type DataGridColorColumn<R> = EditableDataGridColumn<R, string> & {
-  type: 'color';
-};
-
-export type DataGridColumn<R> =
-  | DataGridTextColumn<R>
-  | DataGridNumberColumn<R>
-  | DataGridDateColumn<R>
-  | DataGridCheckboxColumn<R>
-  | DataGridSelectColumn<R>
-  | DataGridForeignListColumn<R>
-  | DataGridColorColumn<R>;
-
-export type DataGridColumnWithFilter<R> = DataGridColumn<R> & {
-  filter: DataGridFilter;
-};
-
-export type DataGridColumns<R> = DataGridColumn<R>[];
-
-export type DataGridFilters = Record<
-  string,
-  DataGridFilter<DataGridFilterType>
->;
-
-export type DataGridProps<R> = {
-  name?: string;
-  className?: string;
-  rows: R[];
-  setRows?: Dispatch<SetStateAction<R[]>>;
-  columns: DataGridColumns<R>;
-  rowKey: string;
-  selectable?: boolean;
-  userSelect?: boolean;
-  editable?: boolean;
-  onRowDoubleClick?: (row: R, e: MouseEvent) => void;
-  onSelectionChange?: (keys: string[]) => void;
-  onSelectedRowsChanged?: (rows: R[]) => void;
-  getAllIds?: () => Promise<string[]>;
-  onFiltersChanged?: (filters: DataGridFilters) => void;
-  onSortsChanged?: (sorts: Record<string, DataGridSort>) => void;
-  onVisibleRowsChange?: (startIndex: number, length: number) => void;
-  onCellEdited?: (row: R, columnKey: string, value: any) => void;
-  rowClassNameGetter?: (row: R | null) => {
-    className?: string;
-    style?: CSSProperties;
-  };
-  headerRowHeight?: number;
-  rowHeight?: number;
-  filter?: boolean;
-  sort?: boolean;
-  initialSorts?: Record<string, DataGridSort>;
-  initialFooters?: Record<string, string>;
-  onFootersChanged?: (footers: Record<string, string>) => void;
-  filterValuesLoader?: (
-    columnKey: string
-  ) => Promise<(string | number | null)[]>;
-  loadCopyRows?: () => Promise<R[]>;
-  refresh?: () => void;
-  headerColor?: ThemeColor;
-  fixedColumnsCount?: number;
-  onRowEdited?: (row: R, columnKey: keyof R, value: any) => void;
-  onSaveClicked?: (
-    addedRows: DataGridEditedRows<R>,
-    editedRows: DataGridEditedRows<R>
-  ) => Promise<string[]>;
-  onAddClicked?: () => Promise<R>;
-  headerContent?: ReactNode;
-} & SpaceProps;
-
-export type DataGridContextProps<R> = DataGridProps<R> & {
-  setRows: Dispatch<SetStateAction<R[]>>;
-  editingCell?: [number, number];
-  setEditingCell: Dispatch<SetStateAction<[number, number]>>;
-  sortedRows: R[];
-  selectedRows: R[];
-  selectedKeys: string[];
-  setSelectedKeys: (selection: string[]) => void;
-  sorts?: Record<string, DataGridSort>;
-  setSorts: (sorts: Record<string, DataGridSort>) => void;
-  filters?: DataGridFilters;
-  setFilters: Dispatch<SetStateAction<DataGridFilters>>;
-  footers?: Record<string, string>;
-  setFooters: Dispatch<SetStateAction<Record<string, string>>>;
-  footerFunctions?: Record<string, DataGridFooterFunction<R>>;
-  visibleColumns: DataGridColumns<R>;
-  copyTable: (
-    includeHeaders?: boolean,
-    includeFooters?: boolean
-  ) => Promise<void>;
-  setColumnWidth: (key: string, width: number) => void;
-  saveSettings: (newSettings?: DataGridSettings) => void;
-  settings: DataGridSettings;
-  setSettings: Dispatch<SetStateAction<DataGridSettings>>;
-  length: number;
-  rowKeyGetter: (row: R) => string;
-  gridTemplateColumns: string;
-  resizingColumnKey: string | null;
-  startResizing: (e: MouseEvent, columnKey: string) => void;
-  moveResizing: (e: MouseEvent) => void;
-  endResizing: () => void;
-  toggleSelection: (key: string) => void;
-
-  addedRows: DataGridEditedRows<R>;
-  updatedRows: DataGridEditedRows<R>;
-  editRow: (row: Partial<R>) => void;
-  addRow: (row: R) => void;
-  addRows: (rows: R[]) => void;
-  updateRow: (row: Partial<R>) => void;
-  clearChangedRows: (keys?: string[]) => void;
-};
-
-export type DataGridContext<R> = Context<DataGridContextProps<R>>;
-
-export const dataGridSettingSchema = z.object({
-  width: z.number().optional(),
-  order: z.number().optional(),
-});
-export const dataGridSettingsSchema = z.record(
-  z.string(),
-  dataGridSettingSchema
-);
-export const dataGridSettingsByNameSchema = z.record(
-  z.string(),
-  dataGridSettingsSchema
-);
-
-export type DataGridSetting = z.infer<typeof dataGridSettingSchema>;
-export type DataGridSettings = z.infer<typeof dataGridSettingsSchema>;
-export type DataGridSettingsByName = z.infer<
-  typeof dataGridSettingsByNameSchema
->;
-export type DataGridSettingsTuple = [string, DataGridSetting];
-export type DataGridSettingsArray = DataGridSettingsTuple[];
-export type DataGridColumnKeyValuePair<R> = [string, DataGridColumn<R>];
-
-export type DataGridCellProps<R, T> = {
-  row: R;
-  rowIndex: number;
-  columnKey: string;
-  columnIndex: number;
-  column: CommonGridColumnProps<R, T> | EditableDataGridColumn<R, T>;
-  context: DataGridContext<R>;
-  className?: string;
-  style?: CSSProperties;
-  userSelect?: boolean;
-  color?: ThemeColor;
-};
-
-export type EditableDataGridCellProps<R, T> = DataGridCellProps<R, T> & {};
-
-export type DataGridHeaderCellProps<R> = {
-  columnKey: string;
-  columnIndex: number;
-  column: DataGridColumn<R>;
-  context: DataGridContext<R>;
-  onFilterButtonClicked?: (columnKey: string) => void;
-  isFilterOpen?: boolean;
-  color?: ThemeColor;
-};
-
-export type DataGridSort = 'asc' | 'desc';
-
-export type DataGridFilterPredicate<T> = (valueToVerify: T) => boolean;
-export type DataGridFilterPredicateBuilder<T> = (
-  ...filterValues: T[]
-) => DataGridFilterPredicate<T>;
-
-export type DataGridFilterOperators<K extends string, T> = {
-  [key in K]: DataGridFilterPredicateBuilder<T>;
-};
-
-export type DataGridFilterPredicates = {
-  date: DataGridFilterOperators<
-    'before' | 'after' | 'equals' | 'notEquals' | 'inRange' | 'inArray',
-    string
-  >;
-  text: DataGridFilterOperators<
-    | 'contains'
-    | 'notContains'
-    | 'equals'
-    | 'notEquals'
-    | 'startsWith'
-    | 'endsWith'
-    | 'inArray',
-    string
-  >;
-  number: DataGridFilterOperators<
-    | 'equals'
-    | 'notEquals'
-    | 'lessThan'
-    | 'lessThanOrEqual'
-    | 'greaterThan'
-    | 'greaterThanOrEqual'
-    | 'inRange'
-    | 'inArray',
-    number
-  >;
-};
-
-export type DataGridFilterType = keyof DataGridFilterPredicates;
-export type DataGridFilterDataType<T extends DataGridFilterType> =
-  DataGridFilterPredicates[T] extends DataGridFilterOperators<string, infer U>
-    ? U
-    : never;
-
-export type DataGridFilterGetter<T extends DataGridFilterType> = (
-  value: any
-) => DataGridFilterDataType<T> | null;
-export type DataGridFilterRenderer = (value: any) => ReactNode;
-export type DataGridFilterFormatter = (value: any) => string;
-
-export type DataGridFilterOperator<T extends DataGridFilterType> =
-  DataGridFilterPredicates[T] extends DataGridFilterOperators<infer K, any>
-    ? K
-    : never;
-
-export type DataGridFilter<T extends string = DataGridFilterType> =
-  T extends DataGridFilterType
-    ? {
-        type: T;
-        operator: DataGridFilterOperator<T>;
-        getter: DataGridFilterGetter<T>;
-        renderer?: DataGridFilterRenderer;
-        formatter?: DataGridFilterFormatter;
-        values: (DataGridFilterDataType<T> | null)[];
-      }
-    : never;
-
-export type DataGridFilterGroup = {
-  name: string;
-  displayValue: DataGridFilterValue;
-  values?: DataGridFilterValue[];
-  groups?: DataGridFilterGroup[];
-};
-
-export type DataGridFilterValue = string | number | null;
-
-export type DataGridFilterCheckbox = {
-  displayValue: ReactNode;
-  title: string;
-  values: DataGridFilterValue[];
-  level: number;
-};
-
-export type DataGridRowTemplateProps<R> = {
-  selected?: boolean;
-  toggleSelection?: () => void;
-  context: DataGridContext<R>;
-};
-
-export type DataGridRefProps<R> = {
-  refresh: () => void;
-  setSelectedKeys: (keys: string[]) => void;
-  addRows: (rows: R[]) => void;
-};
-
-export type DataGridEditedRows<R> = Partial<R>[];
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+import * as z from 'zod';
+
+import {
+  CSSProperties,
+  Context,
+  Dispatch,
+  FC,
+  MouseEvent,
+  MouseEventHandler,
+  ReactNode,
+  SetStateAction,
+} from 'react';
+
+import { DataGridEditableCellFC } from './DataGridEditableCell/types';
+import { SpaceProps } from '../../../helpers/styled';
+import { ThemeColor } from '../../../providers/ThemeProvider/types';
+
+export type DataGridCellFCProps = {
+  onDoubleClick?: MouseEventHandler;
+  style?: CSSProperties;
+  $color?: ThemeColor;
+  $textAlign?: 'left' | 'right' | 'center';
+  $userSelect?: boolean;
+  $headerColor?: ThemeColor;
+};
+
+export type DataGridCellFC = FC<DataGridCellFCProps>;
+
+export type DataGridFooterPredefinedFunction =
+  | 'average'
+  | 'avg'
+  | 'count'
+  | 'max'
+  | 'min'
+  | 'sum';
+export type DataGridFooterFunction<R> = (
+  allRows: R[],
+  filteredRows: R[],
+  selectedRows: R[]
+) => ReactNode;
+
+type ExcelOptions = {
+  formatter?: (value: any) => string;
+  colorGetter?: (value: any) => string;
+  valueGetter?: (value: any) => string;
+};
+
+type CommonGridColumnProps<R, T> = {
+  key: string;
+  component?: DataGridCellFC;
+  color?: ThemeColor;
+  excelOptions?: ExcelOptions;
+  textAlign?: 'left' | 'right' | 'center';
+  filter?: DataGridFilter;
+  footer?:
+    | DataGridFooterFunction<R>
+    | Record<string, DataGridFooterFunction<R> | null>;
+  name: ReactNode;
+  order?: number;
+  getter: (row: R) => T;
+  render?: (
+    value: T,
+    row: R,
+    column: CommonGridColumnProps<R, T>
+  ) => ReactNode | string;
+  resizable?: boolean;
+  sortGetter?: (row: R) => string | number;
+  width?: number;
+};
+
+export type EditableDataGridColumn<R, T> = CommonGridColumnProps<R, T> & {
+  editable?: boolean;
+  editComponent?: DataGridEditableCellFC<R, T>;
+  itemToPartialRow?: (key: string, row: R, value: T) => Partial<R>;
+};
+
+export type DataGridTextColumn<R> = EditableDataGridColumn<R, string> & {
+  type: 'text';
+};
+
+export type DataGridNumberColumn<R> = EditableDataGridColumn<R, number> & {
+  type: 'number';
+  decimals?: number;
+  currency?: string | ((row: R) => string);
+  prefix?: string;
+  suffix?: string;
+};
+
+export type DataGridDateColumn<R> = EditableDataGridColumn<R, string> & {
+  type: 'date';
+};
+
+export type DataGridCheckboxColumn<R> = EditableDataGridColumn<R, boolean> & {
+  type: 'checkbox';
+};
+
+export type DataGridSelectColumn<R, T = any> = EditableDataGridColumn<
+  R,
+  T | null
+> & {
+  type: 'select';
+  items: T[];
+  itemKey: (item: T) => string;
+  itemLabel: (item: T) => string;
+};
+
+export type DataGridForeignListColumn<R> = EditableDataGridColumn<
+  R,
+  string | null
+> & {
+  type: 'foreignList';
+};
+
+export type DataGridColorColumn<R> = EditableDataGridColumn<R, string> & {
+  type: 'color';
+};
+
+export type DataGridColumn<R> =
+  | DataGridTextColumn<R>
+  | DataGridNumberColumn<R>
+  | DataGridDateColumn<R>
+  | DataGridCheckboxColumn<R>
+  | DataGridSelectColumn<R>
+  | DataGridForeignListColumn<R>
+  | DataGridColorColumn<R>;
+
+export type DataGridColumnWithFilter<R> = DataGridColumn<R> & {
+  filter: DataGridFilter;
+};
+
+export type DataGridColumns<R> = DataGridColumn<R>[];
+
+export type DataGridFilters = Record<
+  string,
+  DataGridFilter<DataGridFilterType>
+>;
+
+export type DataGridProps<R> = {
+  name?: string;
+  className?: string;
+  rows: R[];
+  setRows?: Dispatch<SetStateAction<R[]>>;
+  columns: DataGridColumns<R>;
+  rowKey: string;
+  selectable?: boolean;
+  userSelect?: boolean;
+  editable?: boolean;
+  onRowDoubleClick?: (row: R, e: MouseEvent) => void;
+  onSelectionChange?: (keys: string[]) => void;
+  onSelectedRowsChanged?: (rows: R[]) => void;
+  getAllIds?: () => Promise<string[]>;
+  onFiltersChanged?: (filters: DataGridFilters) => void;
+  onSortsChanged?: (sorts: Record<string, DataGridSort>) => void;
+  onVisibleRowsChange?: (startIndex: number, length: number) => void;
+  onCellEdited?: (row: R, columnKey: string, value: any) => void;
+  rowClassNameGetter?: (row: R | null) => {
+    className?: string;
+    style?: CSSProperties;
+  };
+  headerRowHeight?: number;
+  rowHeight?: number;
+  filter?: boolean;
+  sort?: boolean;
+  initialSorts?: Record<string, DataGridSort>;
+  initialFooters?: Record<string, string>;
+  onFootersChanged?: (footers: Record<string, string>) => void;
+  filterValuesLoader?: (
+    columnKey: string
+  ) => Promise<(string | number | null)[]>;
+  loadCopyRows?: () => Promise<R[]>;
+  refresh?: () => void;
+  headerColor?: ThemeColor;
+  fixedColumnsCount?: number;
+  onRowEdited?: (row: R, columnKey: keyof R, value: any) => void;
+  onSaveClicked?: (
+    addedRows: DataGridEditedRows<R>,
+    editedRows: DataGridEditedRows<R>
+  ) => Promise<string[]>;
+  onAddClicked?: () => Promise<R>;
+  headerContent?: ReactNode;
+} & SpaceProps;
+
+export type DataGridContextProps<R> = DataGridProps<R> & {
+  setRows: Dispatch<SetStateAction<R[]>>;
+  editingCell?: [number, number];
+  setEditingCell: Dispatch<SetStateAction<[number, number]>>;
+  sortedRows: R[];
+  selectedRows: R[];
+  selectedKeys: string[];
+  setSelectedKeys: (selection: string[]) => void;
+  sorts?: Record<string, DataGridSort>;
+  setSorts: (sorts: Record<string, DataGridSort>) => void;
+  filters?: DataGridFilters;
+  setFilters: Dispatch<SetStateAction<DataGridFilters>>;
+  footers?: Record<string, string>;
+  setFooters: Dispatch<SetStateAction<Record<string, string>>>;
+  footerFunctions?: Record<string, DataGridFooterFunction<R>>;
+  visibleColumns: DataGridColumns<R>;
+  copyTable: (
+    includeHeaders?: boolean,
+    includeFooters?: boolean
+  ) => Promise<void>;
+  setColumnWidth: (key: string, width: number) => void;
+  saveSettings: (newSettings?: DataGridSettings) => void;
+  settings: DataGridSettings;
+  setSettings: Dispatch<SetStateAction<DataGridSettings>>;
+  length: number;
+  rowKeyGetter: (row: R) => string;
+  gridTemplateColumns: string;
+  resizingColumnKey: string | null;
+  startResizing: (e: MouseEvent, columnKey: string) => void;
+  moveResizing: (e: MouseEvent) => void;
+  endResizing: () => void;
+  toggleSelection: (key: string) => void;
+
+  addedRows: DataGridEditedRows<R>;
+  updatedRows: DataGridEditedRows<R>;
+  editRow: (row: Partial<R>) => void;
+  addRow: (row: R) => void;
+  addRows: (rows: R[]) => void;
+  updateRow: (row: Partial<R>) => void;
+  clearChangedRows: (keys?: string[]) => void;
+};
+
+export type DataGridContext<R> = Context<DataGridContextProps<R>>;
+
+export const dataGridSettingSchema = z.object({
+  width: z.number().optional(),
+  order: z.number().optional(),
+});
+export const dataGridSettingsSchema = z.record(
+  z.string(),
+  dataGridSettingSchema
+);
+export const dataGridSettingsByNameSchema = z.record(
+  z.string(),
+  dataGridSettingsSchema
+);
+
+export type DataGridSetting = z.infer<typeof dataGridSettingSchema>;
+export type DataGridSettings = z.infer<typeof dataGridSettingsSchema>;
+export type DataGridSettingsByName = z.infer<
+  typeof dataGridSettingsByNameSchema
+>;
+export type DataGridSettingsTuple = [string, DataGridSetting];
+export type DataGridSettingsArray = DataGridSettingsTuple[];
+export type DataGridColumnKeyValuePair<R> = [string, DataGridColumn<R>];
+
+export type DataGridCellProps<R, T> = {
+  row: R;
+  rowIndex: number;
+  columnKey: string;
+  columnIndex: number;
+  column: CommonGridColumnProps<R, T> | EditableDataGridColumn<R, T>;
+  context: DataGridContext<R>;
+  className?: string;
+  style?: CSSProperties;
+  userSelect?: boolean;
+  color?: ThemeColor;
+};
+
+export type EditableDataGridCellProps<R, T> = DataGridCellProps<R, T> & {};
+
+export type DataGridHeaderCellProps<R> = {
+  columnKey: string;
+  columnIndex: number;
+  column: DataGridColumn<R>;
+  context: DataGridContext<R>;
+  onFilterButtonClicked?: (columnKey: string) => void;
+  isFilterOpen?: boolean;
+  color?: ThemeColor;
+};
+
+export type DataGridSort = 'asc' | 'desc';
+
+export type DataGridFilterPredicate<T> = (valueToVerify: T) => boolean;
+export type DataGridFilterPredicateBuilder<T> = (
+  ...filterValues: T[]
+) => DataGridFilterPredicate<T>;
+
+export type DataGridFilterOperators<K extends string, T> = {
+  [key in K]: DataGridFilterPredicateBuilder<T>;
+};
+
+export type DataGridFilterPredicates = {
+  date: DataGridFilterOperators<
+    'before' | 'after' | 'equals' | 'notEquals' | 'inRange' | 'inArray',
+    string
+  >;
+  text: DataGridFilterOperators<
+    | 'contains'
+    | 'notContains'
+    | 'equals'
+    | 'notEquals'
+    | 'startsWith'
+    | 'endsWith'
+    | 'inArray',
+    string
+  >;
+  number: DataGridFilterOperators<
+    | 'equals'
+    | 'notEquals'
+    | 'lessThan'
+    | 'lessThanOrEqual'
+    | 'greaterThan'
+    | 'greaterThanOrEqual'
+    | 'inRange'
+    | 'inArray',
+    number
+  >;
+};
+
+export type DataGridFilterType = keyof DataGridFilterPredicates;
+export type DataGridFilterDataType<T extends DataGridFilterType> =
+  DataGridFilterPredicates[T] extends DataGridFilterOperators<string, infer U>
+    ? U
+    : never;
+
+export type DataGridFilterGetter<T extends DataGridFilterType> = (
+  value: any
+) => DataGridFilterDataType<T> | null;
+export type DataGridFilterRenderer = (value: any) => ReactNode;
+export type DataGridFilterFormatter = (value: any) => string;
+
+export type DataGridFilterOperator<T extends DataGridFilterType> =
+  DataGridFilterPredicates[T] extends DataGridFilterOperators<infer K, any>
+    ? K
+    : never;
+
+export type DataGridFilter<T extends string = DataGridFilterType> =
+  T extends DataGridFilterType
+    ? {
+        type: T;
+        operator: DataGridFilterOperator<T>;
+        getter: DataGridFilterGetter<T>;
+        renderer?: DataGridFilterRenderer;
+        formatter?: DataGridFilterFormatter;
+        values: (DataGridFilterDataType<T> | null)[];
+      }
+    : never;
+
+export type DataGridFilterGroup = {
+  name: string;
+  displayValue: DataGridFilterValue;
+  values?: DataGridFilterValue[];
+  groups?: DataGridFilterGroup[];
+};
+
+export type DataGridFilterValue = string | number | null;
+
+export type DataGridFilterCheckbox = {
+  displayValue: ReactNode;
+  title: string;
+  values: DataGridFilterValue[];
+  level: number;
+};
+
+export type DataGridRowTemplateProps<R> = {
+  selected?: boolean;
+  toggleSelection?: () => void;
+  context: DataGridContext<R>;
+};
+
+export type DataGridRefProps<R> = {
+  refresh: () => void;
+  setSelectedKeys: (keys: string[]) => void;
+  addRows: (rows: R[]) => void;
+};
+
+export type DataGridEditedRows<R> = Partial<R>[];