import { Component, type PropertyValues, type HTMLTemplateResult } from '@a11d/lit';
import { LocalStorage } from '@a11d/local-storage';
import { InstanceofAttributeController } from '@3mo/instanceof-attribute-controller';
import { SlotController } from '@3mo/slot-controller';
import { MediaQueryController } from '@3mo/media-query-observer';
import { DataGridColumnsController } from './DataGridColumnsController.js';
import { DataGridSelectionBehaviorOnDataChange, DataGridSelectionController, type DataGridSelectability } from './DataGridSelectionController.js';
import { DataGridSortingController, type DataGridRankedSortDefinition, type DataGridSorting } from './DataGridSortingController.js';
import { DataGridDetailsController } from './DataGridDetailsController.js';
import { type DataGridColumn, DataGridCsvController, DataGridSidePanelTab, type DataGridCell, type DataGridRow, DataGridContextMenuController, DataGridReorderabilityController, type DataGridReorderChange } from './index.js';
import { DataRecord } from './DataRecord.js';
export type DataGridPagination = 'auto' | number;
export declare enum DataGridEditability {
Never = "never",
Cell = "cell",
Always = "always"
}
/**
* @element mo-data-grid
*
* @attr data - The data to be displayed in the DataGrid. It is an array of objects, where each object represents a row.
* @attr columns - The columns to be displayed in the DataGrid. It is an array of objects, where each object represents a column.
* @attr headerHidden - Whether the header should be hidden.
* @attr page - The current page.
* @attr pagination - The pagination mode. It can be either `auto` or a number.
* @attr sorting - The sorting mode. It is an object with `selector` and `strategy` properties.
* @attr selectability - The selection mode. Default to 'single' if context menus available, 'undefined' otherwise.
* @attr isDataSelectable - Whether data of a given row is selectable.
* @attr selectedData - The selected data.
* @attr selectOnClick - Whether the row should be selected on click.
* @attr selectionBehaviorOnDataChange - The behavior of the selection when the data changes.
* @attr reorderability - Whether the rows can be reordered. Can only be enabled if sorting is not active, selectability is not 'multiple', and no details are present.
* @attr multipleDetails - Whether multiple details can be opened at the same time.
* @attr subDataGridDataSelector - The key path of the sub data grid data.
* @attr hasDataDetail - Whether the data has a detail.
* @attr detailsOnClick - Whether the details should be opened on click.
* @attr primaryContextMenuItemOnDoubleClick - The primary context menu item on double click.
* @attr editability - The editability mode.
* @attr getRowDetailsTemplate - A function which returns a template for the details of a given row.
* @attr getRowContextMenuTemplate - A function which returns a template for the context menu of a given row.
* @attr sidePanelTab - The side panel tab.
* @attr sidePanelHidden - Whether the side panel should be hidden.
* @attr hasAlternatingBackground - Whether the rows should have alternating background.
* @attr preventFabCollapse - Whether the FAB should be prevented from collapsing.
* @attr cellFontSize - The font size of the cells relative to the default font size. Defaults @see DataGrid.cellFontSize 's value which defaults to 0.8.
* @attr rowHeight - The height of the rows in pixels. Defaults to @see DataGrid.rowHeight 's value which defaults to 35.
* @attr exportable - Whether the DataGrid is exportable. This will show an export button in the footer.
*
* @slot - Use this slot only for declarative DataGrid APIs e.g. setting ColumnDefinitions via `mo-data-grid-columns` tag.
* @slot toolbar - The horizontal bar above DataGrid's contents.
* @slot toolbar-action - A slot for action icon-buttons in the toolbar which are displayed on the end.
* @slot filter - A vertical bar for elements which filter DataGrid's data. It is opened through an icon-button in the toolbar.
* @slot sum - A horizontal bar in the DataGrid's footer for showing sums. Calculated sums are also placed here by default.
* @slot fab - A wrapper at the bottom right edge, floating right above the footer, expecting Floating Action Button to be placed in.
* @slot error-no-content - A slot for displaying an error message when no data is available.
*
* @cssprop --mo-data-grid-min-visible-rows - The minimum number of visible rows. Default to 2.5.
* @cssprop --mo-data-grid-footer-background - The background of the footer.
* @cssprop --mo-data-grid-cell-padding - The inline padding of the cells. Default to 10px.
* @cssprop --mo-data-grid-column-sub-row-indentation - The indentation of the first column in the sub row. Default to 20px.
*
* @fires dataChange
* @fires selectionChange
* @fires pageChange
* @fires paginationChange
* @fires columnsChange
* @fires sidePanelOpen
* @fires sidePanelClose
* @fires sortingChange
* @fires reorder
* @fires rowDetailsOpen
* @fires rowDetailsClose
* @fires rowClick
* @fires rowDoubleClick
* @fires rowMiddleClick
* @fires cellEdit
*/
export declare class DataGrid extends Component {
static readonly rowHeight: LocalStorage;
static readonly cellRelativeFontSize: LocalStorage;
static readonly pageSize: LocalStorage;
static readonly hasAlternatingBackground: LocalStorage;
protected static readonly defaultRowElementTag: import("lit-html/static.js").StaticValue;
readonly dataChange: EventDispatcher>;
readonly selectionChange: EventDispatcher>;
readonly pageChange: EventDispatcher;
readonly paginationChange: EventDispatcher;
readonly columnsChange: EventDispatcher>>;
readonly sidePanelOpen: EventDispatcher;
readonly sidePanelClose: EventDispatcher;
readonly sortingChange: EventDispatcher>>;
readonly reorder: EventDispatcher>>;
readonly rowDetailsOpen: EventDispatcher>;
readonly rowDetailsClose: EventDispatcher>;
readonly rowClick: EventDispatcher>;
readonly rowDoubleClick: EventDispatcher>;
readonly rowMiddleClick: EventDispatcher>;
readonly cellEdit: EventDispatcher>;
data: TData[];
columns: DataGridColumn[];
headerHidden: boolean;
page: number;
pagination?: DataGridPagination;
sorting?: DataGridSorting;
selectability?: DataGridSelectability;
isDataSelectable?: (data: TData) => boolean;
selectedData: TData[];
selectOnClick: boolean;
selectionBehaviorOnDataChange: DataGridSelectionBehaviorOnDataChange;
reorderability?: boolean;
getRowDetailsTemplate?: (data: TData) => HTMLTemplateResult;
multipleDetails: boolean;
subDataGridDataSelector?: KeyPath.Of;
hasDataDetail?: (data: TData) => boolean;
detailsOnClick: boolean;
getRowContextMenuTemplate?: (data: Array) => HTMLTemplateResult;
primaryContextMenuItemOnDoubleClick: boolean;
editability: DataGridEditability;
sidePanelTab: DataGridSidePanelTab | undefined;
sidePanelHidden: boolean;
hasAlternatingBackground: boolean;
preventFabCollapse: boolean;
protected fabSlotCollapsed: boolean;
exportable: boolean;
cellFontSize: number;
rowHeight: number;
private readonly header?;
private readonly scroller?;
readonly rows: Array>;
private readonly footer?;
private readonly sidePanel?;
setPage(page: number): void;
setPagination(pagination?: DataGridPagination): void;
setData(data: Array, selectionBehavior?: DataGridSelectionBehaviorOnDataChange): void;
get hasSelection(): boolean;
selectAll(...parameters: Parameters): void;
deselectAll(...parameters: Parameters): void;
select(...parameters: Parameters): void;
isSelectable(...parameters: Parameters): boolean;
get hasDetails(): boolean;
get allRowDetailsOpen(): boolean;
openRowDetails(...parameters: Parameters): void;
closeRowDetails(...parameters: Parameters): void;
toggleRowDetails(...parameters: Parameters): void;
getSorting(...parameters: Parameters): DataGridRankedSortDefinition[];
sort(...parameters: Parameters): void;
unsort(...parameters: Parameters): void;
generateCsv(...parameters: Parameters): Promise;
setColumns(...parameters: Parameters): void;
extractColumns(...parameters: Parameters): void;
protected handleColumnChange(e: CustomEvent): void;
get extractedColumns(): DataGridColumn[];
extractedColumnsUpdated(extractedColumns: Array>): void;
get visibleColumns(): DataGridColumn[];
getRow(data: TData): DataGridRow | undefined;
getCell(data: TData, column: DataGridColumn): DataGridCell | undefined;
handleEdit(data: TData, column: DataGridColumn, value: KeyPath.ValueOf> | undefined): void;
navigateToSidePanelTab(tab?: DataGridSidePanelTab): void;
get hasContextMenu(): boolean;
get toolbarElements(): Element[];
get hasToolbar(): boolean;
get filterElements(): Element[];
get hasFilters(): boolean;
get hasSums(): boolean;
get hasFabs(): boolean;
get hasPagination(): boolean;
get supportsDynamicPageSize(): boolean;
get pageSize(): number;
get hasFooter(): boolean;
get dataLength(): number | undefined;
get maxPage(): number | undefined;
get hasNextPage(): boolean;
protected readonly slotController: SlotController;
protected readonly instanceofAttributeController: InstanceofAttributeController;
protected readonly smallScreenObserverController: MediaQueryController;
readonly columnsController: DataGridColumnsController;
readonly selectionController: DataGridSelectionController;
readonly sortingController: DataGridSortingController;
readonly contextMenuController: DataGridContextMenuController;
readonly detailsController: DataGridDetailsController;
readonly csvController: DataGridCsvController;
readonly reorderabilityController: DataGridReorderabilityController;
readonly rowIntersectionObserver?: IntersectionObserver;
protected updated(...parameters: Parameters): void;
private navigateToLastValidPageIfNeeded;
protected firstUpdated(props: PropertyValues): void;
static get styles(): import("@a11d/lit").CSSResult;
protected get template(): HTMLTemplateResult;
private readonly splitterResizerTemplate;
private get splitterModeTemplate();
private get overlayModeTemplate();
private get sidePanelTemplate();
protected get filtersDefaultTemplate(): HTMLTemplateResult;
protected get columnsTemplate(): HTMLTemplateResult;
protected get rowElementTag(): import("lit-html/static.js").StaticValue;
get hasDefaultRowElements(): boolean;
protected get fabTemplate(): HTMLTemplateResult;
protected get contentTemplate(): HTMLTemplateResult;
protected get noContentTemplate(): HTMLTemplateResult;
protected get dataGridTemplate(): HTMLTemplateResult;
protected get headerTemplate(): HTMLTemplateResult;
private get rowsTemplate();
/**
* The hidden size anchor row renders the longest content of each column in a hidden row.
* This is used to mitigate the issue of using values with fluctuating lengths
* with a automatic column width e.g. "max-content" or "fit-content" in combination with
* row virtualization, which could lead to a lot of column resizing during scrolling.
*/
private get hiddenSizeAnchorRowTemplate();
getRowTemplate(dataRecord: DataRecord, index?: number): import("lit-html").TemplateResult;
protected get footerTemplate(): HTMLTemplateResult;
get sumsTemplate(): HTMLTemplateResult;
protected get toolbarTemplate(): HTMLTemplateResult;
protected get toolbarDefaultTemplate(): HTMLTemplateResult;
protected get toolbarActionDefaultTemplate(): HTMLTemplateResult;
protected get sumDefaultTemplate(): HTMLTemplateResult;
protected get toolbarActionsTemplate(): HTMLTemplateResult;
private lastScrollElementTop;
private handleScroll;
protected handlePointerDown(event: PointerEvent): void;
protected getFlattenedData(values?: TData[]): DataRecord[];
get dataRecords(): Array>;
get renderDataRecords(): DataRecord[];
protected get dataSkip(): number;
protected get dataTake(): number;
getCsvData(): AsyncGenerator[], unknown>;
}
declare global {
interface HTMLElementTagNameMap {
'mo-data-grid': DataGrid;
}
}
//# sourceMappingURL=DataGrid.d.ts.map