UNPKG

@firecms/core

Version:

Awesome Firebase/Firestore-based headless open-source CMS

90 lines (89 loc) 3.62 kB
import React from "react"; import { CollectionSize, Entity, EntityTableController, FilterValues } from "../../types"; import { CellRendererParams, VirtualTableColumn } from "../VirtualTable"; import { OnCellValueChange, OnColumnResizeParams } from "../common"; export type SelectableTableProps<M extends Record<string, any>> = { /** * Callback when a cell value changes. */ onValueChange?: OnCellValueChange<any, M>; columns: VirtualTableColumn[]; cellRenderer: React.ComponentType<CellRendererParams<Entity<M>>>; /** * Builder for creating the buttons in each row * @param entity * @param size */ tableRowActionsBuilder?: (params: { entity: Entity<M>; size: CollectionSize; width: number; frozen?: boolean; }) => React.ReactNode; /** * Callback when anywhere on the table is clicked */ onEntityClick?(entity: Entity<M>): void; /** * Callback when a column is resized */ onColumnResize?(params: OnColumnResizeParams): void; /** * Should apply a different style to a row when hovering */ hoverRow?: boolean; /** * Controller holding the logic for the table * {@link useDataSourceTableController} * {@link EntityTableController} */ tableController: EntityTableController<M>; filterable?: boolean; sortable?: boolean; inlineEditing?: boolean; forceFilter?: FilterValues<keyof M extends string ? keyof M : never>; highlightedRow?: (data: Entity<M>) => boolean; size?: CollectionSize; initialScroll?: number; /** * Callback when the table is scrolled * @param props */ onScroll?: (props: { scrollDirection: "forward" | "backward"; scrollOffset: number; scrollUpdateWasRequested: boolean; }) => void; emptyComponent?: React.ReactNode; endAdornment?: React.ReactNode; AddColumnComponent?: React.ComponentType; /** * Callback when columns are reordered via drag-and-drop */ onColumnsOrderChange?: (columns: VirtualTableColumn[]) => void; }; /** * This component is in charge of rendering a collection table with a high * degree of customization. * * This component is used internally by {@link EntityCollectionView} and * {@link useReferenceDialog} * * Please note that you only need to use this component if you are building * a custom view. If you just need to create a default view you can do it * exclusively with config options. * * If you want to bind a {@link EntityCollection} to a table with the default * options you see in collections in the top level navigation, you can * check {@link EntityCollectionView}. * * The data displayed in the table is managed by a {@link EntityTableController}. * You can build the default, bound to a path in the datasource, by using the hook * {@link useDataSourceTableController} * * @see EntityCollectionTableProps * @see EntityCollectionView * @see VirtualTable * @group Components */ export declare const SelectableTable: <M extends Record<string, any>>({ onValueChange, cellRenderer, onEntityClick, onColumnResize, hoverRow, size, inlineEditing, tableController: { data, dataLoading, noMoreToLoad, dataLoadingError, filterValues, setFilterValues, sortBy, setSortBy, itemCount, setItemCount, pageSize, paginationEnabled, checkFilterCombination, setPopupCell }, filterable, onScroll, initialScroll, emptyComponent, columns, forceFilter, highlightedRow, endAdornment, AddColumnComponent, onColumnsOrderChange }: SelectableTableProps<M>) => import("react/jsx-runtime").JSX.Element;