flipper-plugin
Version:
Flipper Desktop plugin SDK and components
140 lines • 6.49 kB
TypeScript
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
import type { DataTableColumn } from './DataTableWithPowerSearch';
import { Percentage } from '../../utils/widthUtils';
import { MutableRefObject, Reducer, RefObject } from 'react';
import { DataSource, DataSourceView, DataSourceVirtualizer } from '../../data-source/index';
import { SearchExpressionTerm } from '../PowerSearch';
import { PowerSearchOperatorProcessorConfig } from './DataTableDefaultPowerSearchOperators';
import { DataTableManager as DataTableManagerLegacy } from './DataTableManager';
export type OnColumnResize = (id: string, size: number | Percentage) => void;
export type Sorting<T = any> = {
key: keyof T;
direction: Exclude<SortDirection, undefined>;
};
export type SearchHighlightSetting = {
highlightEnabled: boolean;
color: string;
};
export type SortDirection = 'asc' | 'desc' | undefined;
export type Selection = {
items: ReadonlySet<number>;
current: number;
};
type Action<Name extends string, Args = {}> = {
type: Name;
} & Args;
type DataManagerActions<T> =
/** Reset the current table preferences, including column widths an visibility, back to the default */
Action<'reset'>
/** Disable the current column filters */
| Action<'resetFilters'>
/** Resizes the column with the given key to the given width */
| Action<'resizeColumn', {
column: keyof T;
width: number | Percentage;
}>
/** Sort by the given column. This toggles statefully between ascending, descending, none (insertion order of the data source) */
| Action<'sortColumn', {
column: keyof T;
direction: SortDirection;
}>
/** Show / hide the given column */
| Action<'toggleColumnVisibility', {
column: keyof T;
}> | Action<'setSearchExpression', {
searchExpression?: SearchExpressionTerm[];
}> | Action<'selectItem', {
nextIndex: number | ((currentIndex: number) => number);
addToSelection?: boolean;
allowUnselect?: boolean;
}> | Action<'selectItemById', {
id: string;
addToSelection?: boolean;
}> | Action<'addRangeToSelection', {
start: number;
end: number;
allowUnselect?: boolean;
}> | Action<'clearSelection', {}> | Action<'setSearchExpressionFromSelection', {
column: DataTableColumn<T>;
}> | Action<'setFilterExceptions', {
exceptions: string[] | undefined;
}> | Action<'appliedInitialScroll'> | Action<'toggleAutoScroll'> | Action<'setAutoScroll', {
autoScroll: boolean;
}> | Action<'toggleSideBySide'> | Action<'showSearchDropdown', {
show: boolean;
}> | Action<'setShowNumberedHistory', {
showNumberedHistory: boolean;
}>;
type DataManagerConfig<T> = {
dataSource: DataSource<T, T[keyof T]>;
dataView: DataSourceView<T, T[keyof T]>;
defaultColumns: DataTableColumn<T>[];
scope: string;
onSelect: undefined | ((item: T | undefined, items: T[]) => void);
virtualizerRef: MutableRefObject<DataSourceVirtualizer | undefined>;
autoScroll?: boolean;
enablePersistSettings?: boolean;
initialSearchExpression?: SearchExpressionTerm[];
};
export type DataManagerState<T> = {
config: DataManagerConfig<T>;
usesWrapping: boolean;
storageKey: string;
initialOffset: number;
columns: DataTableColumn[];
sorting: Sorting<T> | undefined;
selection: Selection;
autoScroll: boolean;
searchExpression: SearchExpressionTerm[];
filterExceptions: string[] | undefined;
sideBySide: boolean;
};
export type DataTableReducer<T> = Reducer<DataManagerState<T>, DataManagerActions<T>>;
export type DataTableDispatch<T = any> = React.Dispatch<DataManagerActions<T>>;
export declare const dataTableManagerReducer: (state: DataManagerState<any>, args_0: DataManagerActions<any>) => DataManagerState<any>;
/**
* Public only imperative convienience API for DataTable
*/
export type DataTableManager<T> = {
reset(): void;
resetFilters(): void;
selectItem(index: number | ((currentSelection: number) => number), addToSelection?: boolean, allowUnselect?: boolean): void;
addRangeToSelection(start: number, end: number, allowUnselect?: boolean): void;
setAutoScroll(autoScroll: boolean): void;
selectItemById(id: string, addToSelection?: boolean): void;
clearSelection(): void;
getSelectedItem(): T | undefined;
getSelectedItems(): readonly T[];
toggleColumnVisibility(column: keyof T): void;
sortColumn(column: keyof T, direction?: SortDirection): void;
setSearchExpression(searchExpression: SearchExpressionTerm[]): void;
dataView: DataSourceView<T, T[keyof T]>;
stateRef: RefObject<Readonly<DataManagerState<T>>>;
toggleSideBySide(): void;
setFilterExceptions(exceptions: string[] | undefined): void;
} & Omit<DataTableManagerLegacy<T>, 'stateRef'>;
export declare function createDataTableManager<T>(dataView: DataSourceView<T, T[keyof T]>, dispatch: DataTableDispatch<T>, stateRef: MutableRefObject<DataManagerState<T>>): DataTableManager<T>;
export declare function createInitialState<T>(config: DataManagerConfig<T>): DataManagerState<T>;
export declare function getSelectedItem<T>(dataView: DataSourceView<T, T[keyof T]>, selection: Selection): T | undefined;
export declare function getSelectedItems<T>(dataView: DataSourceView<T, T[keyof T]>, selection: Selection): T[];
export declare function savePreferences(state: DataManagerState<any>, scrollOffset: number): void;
/**
* A somewhat primitive and unsafe way to access nested fields an object.
* @param obj keys should only be strings
* @param keyPath dotted string path, e.g foo.bar
* @returns value at the key path
*/
export declare function getValueAtPath(obj: Record<string, any>, keyPath: string): any;
export declare function computeDataTableFilter(searchExpression: SearchExpressionTerm[], powerSearchProcessors: PowerSearchOperatorProcessorConfig, treatUndefinedValuesAsMatchingFiltering?: boolean): (item: any) => boolean;
export declare function safeCreateRegExp(source: string): RegExp | undefined;
export declare function computeSetSelection(base: Selection, nextIndex: number | ((currentIndex: number) => number), addToSelection?: boolean, allowUnselect?: boolean): Selection;
export declare function computeAddRangeToSelection(base: Selection, start: number, end: number, allowUnselect?: boolean): Selection;
export {};
//# sourceMappingURL=DataTableWithPowerSearchManager.d.ts.map