package.src.vaadin-grid-mixin.d.ts Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of grid Show documentation
A free, flexible and high-quality Web Component for showing large amounts of tabular data
There is a newer version: 24.6.0
/**
 * @license
 * Copyright (c) 2016 - 2024 Vaadin Ltd.
 * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
 */
import type { Constructor } from '@open-wc/dedupe-mixin';
import type { DisabledMixinClass } from '@vaadin/a11y-base/src/disabled-mixin.js';
import type { ActiveItemMixinClass } from './vaadin-grid-active-item-mixin.js';
import type { ArrayDataProviderMixinClass } from './vaadin-grid-array-data-provider-mixin.js';
import type { GridColumn } from './vaadin-grid-column.js';
import { GridBodyRenderer, GridHeaderFooterRenderer } from './vaadin-grid-column.js';
import type { ColumnReorderingMixinClass } from './vaadin-grid-column-reordering-mixin.js';
import type { DataProviderMixinClass } from './vaadin-grid-data-provider-mixin.js';
import {
  GridDataProvider,
  GridDataProviderCallback,
  GridDataProviderParams,
  GridFilterDefinition,
  GridSorterDefinition,
  GridSorterDirection,
} from './vaadin-grid-data-provider-mixin.js';
import type { DragAndDropMixinClass } from './vaadin-grid-drag-and-drop-mixin.js';
import { GridDragAndDropFilter, GridDropLocation, GridDropMode } from './vaadin-grid-drag-and-drop-mixin.js';
import type { EventContextMixinClass } from './vaadin-grid-event-context-mixin.js';
import { GridEventContext } from './vaadin-grid-event-context-mixin.js';
import type { RowDetailsMixinClass } from './vaadin-grid-row-details-mixin.js';
import { GridRowDetailsRenderer } from './vaadin-grid-row-details-mixin.js';
import type { ScrollMixinClass } from './vaadin-grid-scroll-mixin.js';
import type { SelectionMixinClass } from './vaadin-grid-selection-mixin.js';
import type { SortMixinClass } from './vaadin-grid-sort-mixin.js';
import type {
  GridCellClassNameGenerator,
  GridCellPartNameGenerator,
  StylingMixinClass,
} from './vaadin-grid-styling-mixin.js';

export {
  GridBodyRenderer,
  GridCellClassNameGenerator,
  GridCellPartNameGenerator,
  GridDataProvider,
  GridDataProviderCallback,
  GridDataProviderParams,
  GridDragAndDropFilter,
  GridDropLocation,
  GridDropMode,
  GridEventContext,
  GridFilterDefinition,
  GridHeaderFooterRenderer,
  GridRowDetailsRenderer,
  GridSorterDefinition,
  GridSorterDirection,
};

export interface GridItemModel {
  index: number;
  item: TItem;
  selected?: boolean;
  expanded?: boolean;
  level?: number;
  detailsOpened?: boolean;
}

/**
 * Fired when the `activeItem` property changes.
 */
export type GridActiveItemChangedEvent = CustomEvent<{ value: TItem | null | undefined }>;

/**
 * Fired when the cell is activated with click or keyboard.
 */
export type GridCellActivateEvent = CustomEvent<{ model: GridItemModel }>;

/**
 * Fired when a cell is focused with click or keyboard navigation.
 */
export type GridCellFocusEvent = CustomEvent<{ context: GridEventContext }>;

/**
 * Fired when the columns in the grid are reordered.
 */
export type GridColumnReorderEvent = CustomEvent<{ columns: Array> }>;

/**
 * Fired when the grid column resize is finished.
 */
export type GridColumnResizeEvent = CustomEvent<{ resizedColumn: GridColumn }>;

/**
 * Fired when the `dataProvider` property changes.
 */
export type GridDataProviderChangedEvent = CustomEvent<{ value: GridDataProvider }>;

/**
 * Fired when the `expandedItems` property changes.
 */
export type GridExpandedItemsChangedEvent = CustomEvent<{ value: TItem[] }>;

/**
 * Fired when starting to drag grid rows.
 */
export type GridDragStartEvent = CustomEvent<{
  draggedItems: TItem[];
  setDraggedItemsCount(count: number): void;
  setDragData(type: string, data: string): void;
}>;

/**
 * Fired when a drop occurs on top of the grid.
 */
export type GridDropEvent = CustomEvent<{
  dropTargetItem: TItem;
  dropLocation: GridDropLocation;
  dragData: Array<{ type: string; data: string }>;
}>;

/**
 * Fired when the `loading` property changes.
 */
export type GridLoadingChangedEvent = CustomEvent<{ value: boolean }>;

/**
 * Fired when the `selectedItems` property changes.
 */
export type GridSelectedItemsChangedEvent = CustomEvent<{ value: TItem[] }>;

/**
 * Fired when the `size` property changes.
 */
export type GridSizeChangedEvent = CustomEvent<{ value: number }>;

export interface GridCustomEventMap {
  'active-item-changed': GridActiveItemChangedEvent;

  'cell-activate': GridCellActivateEvent;

  'cell-focus': GridCellFocusEvent;

  'column-reorder': GridColumnReorderEvent;

  'column-resize': GridColumnResizeEvent;

  'data-provider-changed': GridDataProviderChangedEvent;

  'expanded-items-changed': GridExpandedItemsChangedEvent;

  'grid-dragstart': GridDragStartEvent;

  'grid-dragend': Event;

  'grid-drop': GridDropEvent;

  'loading-changed': GridLoadingChangedEvent;

  'selected-items-changed': GridSelectedItemsChangedEvent;

  'size-changed': GridSizeChangedEvent;
}

export interface GridEventMap extends HTMLElementEventMap, GridCustomEventMap {}

export declare function GridMixin>(
  base: T,
): Constructor> &
  Constructor> &
  Constructor &
  Constructor> &
  Constructor &
  Constructor> &
  Constructor> &
  Constructor> &
  Constructor> &
  Constructor &
  Constructor> &
  Constructor &
  Constructor> &
  T;

export interface GridMixinClass
  extends DisabledMixinClass,
    ActiveItemMixinClass,
    ArrayDataProviderMixinClass,
    DataProviderMixinClass,
    RowDetailsMixinClass,
    ScrollMixinClass,
    SelectionMixinClass,
    SortMixinClass,
    ColumnReorderingMixinClass,
    EventContextMixinClass,
    StylingMixinClass,
    DragAndDropMixinClass {
  /**
   * If true, the grid's height is defined by its rows.
   *
   * Effectively, this disables the grid's virtual scrolling so that all the rows are rendered in the DOM at once.
   * If the grid has a large number of items, using the feature is discouraged to avoid performance issues.
   * @attr {boolean} all-rows-visible
   */
  allRowsVisible: boolean;

  /**
   * Updates the `width` of all columns which have `autoWidth` set to `true`.
   */
  recalculateColumnWidths(): void;

  /**
   * Requests an update for the content of cells.
   *
   * While performing the update, the following renderers are invoked:
   * - `Grid.rowDetailsRenderer`
   * - `GridColumn.renderer`
   * - `GridColumn.headerRenderer`
   * - `GridColumn.footerRenderer`
   *
   * It is not guaranteed that the update happens immediately (synchronously) after it is requested.
   */
  requestContentUpdate(): void;
}