UNPKG

smart-webcomponents-angular

Version:

[![Price](https://img.shields.io/badge/price-COMMERCIAL-0098f7.svg)](https://jqwidgets.com/license/)

1 lines 219 kB
{"version":3,"file":"smart-webcomponents-angular-grid.mjs","sources":["../../grid/src/smart.element.ts","../../grid/src/smart.grid.ts","../../grid/src/smart.grid.module.ts","../../grid/src/smart-webcomponents-angular-grid.ts"],"sourcesContent":["\ndeclare global {\n interface Window {\n Smart: any;\n}\n}\n\n\nimport { Directive, ElementRef, Input, Output, EventEmitter } from '@angular/core';\nimport { ElementRenderMode } from './../index';\n\n@Directive()\nexport class BaseElement {\n constructor(ref: ElementRef) {\n const that = this;\n this.nativeElement = ref.nativeElement as any;\n\n that.nativeElement.onAttached = () => {\n that.onAttach.emit(that.nativeElement);\n }\n\n that.nativeElement.onDetached = () => {\n that.onDetach.emit(that.nativeElement);\n }\n }\n\n @Output() onCreate: EventEmitter<any> = new EventEmitter();\n @Output() onReady: EventEmitter<any> = new EventEmitter();\n @Output() onAttach: EventEmitter<any> = new EventEmitter();\n @Output() onDetach: EventEmitter<any> = new EventEmitter();\n\n public nativeElement: any;\n\n public addEventListener(type: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions = false): void {\n this.nativeElement.addEventListener(type, listener, options);\n\t}\n\n\tpublic removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions = false): void {\n\t\tthis.nativeElement.removeEventListener(type, listener, options);\n\t}\n\n\tpublic dispatchEvent(event: Event): boolean {\n\t\treturn this.nativeElement.dispatchEvent(event);\n\t}\n\n\tpublic blur(): void {\n\t\tthis.nativeElement.blur();\n\t}\n\n\tpublic click(): void {\n\t\tthis.nativeElement.click();\n\t}\n\n\tpublic focus(options?: FocusOptions): void {\n\t\tthis.nativeElement.focus(options);\n\t}\n\n/** @description Sets or gets the license. */\n\t@Input()\n\tget license(): string {\n\t\treturn this.nativeElement ? this.nativeElement.license : undefined;\n\t}\n\tset license(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.license = value : undefined;\n\t}\n\t\n/** @description Sets or gets the language. Used in conjunction with the property messages. */\n\t@Input()\n\tget locale(): string {\n\t\treturn this.nativeElement ? this.nativeElement.locale : undefined;\n\t}\n\tset locale(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.locale = value : undefined;\n\t}\n\n\t/** @description Callback used to customize the format of the messages that are returned from the Localization Module. */\n\t@Input()\n\tget localizeFormatFunction(): any {\n\t\treturn this.nativeElement ? this.nativeElement.localizeFormatFunction : undefined;\n\t}\n\tset localizeFormatFunction(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.localizeFormatFunction = value : undefined;\n\t}\n\n\t/** @description Sets or gets an object specifying strings used in the widget that can be localized. Used in conjunction with the property locale. */\n\t@Input()\n\tget messages(): any {\n\t\treturn this.nativeElement ? this.nativeElement.messages : undefined;\n\t}\n\tset messages(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.messages = value : undefined;\n\t}\n\n\t/** @description Sets or gets the value indicating whether the element is aligned to support locales using right-to-left fonts. */\n\t@Input()\n\tget rightToLeft(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.rightToLeft : undefined;\n\t}\n\tset rightToLeft(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.rightToLeft = value : undefined;\n\t}\n\n\t/** @description Determines the theme. Theme defines the look of the element */\n\t@Input()\n\tget theme(): string {\n\t\treturn this.nativeElement ? this.nativeElement.theme : undefined;\n\t}\n\tset theme(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.theme = value : undefined;\n\t}\n}\n\nlet Smart: any;\nif (typeof window !== \"undefined\") {\n\tSmart = window.Smart;\n}\nexport { Smart };\n\n","import { Grid } from './../index';\nimport { GridAppearanceAutoGenerateRowLabelMode, GridAppearanceAutoGenerateColumnLabelMode, GridResizeMode, GridClipboardAutoFillMode, HorizontalAlignment, VerticalAlignment, Position, GridColumnFilterMenuMode, GridColumnSortOrder, GridConditionalFormattingCondition, GridDataExportPageOrientation, GridDataSourceSettingsSanitizeHTML, GridDataSourceSettingsDataFieldDataType, GridDataSourceSettingsDataSourceType, GridEditingAction, LayoutPosition, GridCommandDisplayMode, GridEditingMode, GridEditingAddNewRowDisplayMode, GridFilteringFilterRowApplyMode, GridFilteringFilterMenuMode, GridGroupingExpandMode, GridGroupingRenderMode, GridHeaderSearchCommand, GridPagerAutoEllipsis, Scrolling, GridSelectionMode, GridSelectionAction, GridSelectionCheckBoxesSelectAllMode, GridSortingMode, GridSortingCommandKey, GridAppearance, GridBehavior, GridColumnHeader, GridClipboard, GridColumn, GridContextMenu, GridContextMenuDataSource, GridCommand, GridColumnMenu, GridColumnMenuDataSource, GridColumnGroup, GridConditionalFormatting, GridCharting, Dialog, GridCheckBoxes, GridDataExport, GridDataSourceSettings, GridDataSourceSettingsDataField, GridEditing, GridEditingCommandKeys, GridCommandKey, GridEditingCommandBar, GridEditingCommandBarDataSource, GridEditingCommandColumn, GridEditingCommandColumnDataSource, GridEditingAddNewRow, GridEditingAddNewColumn, GridFiltering, GridFilteringFilterRow, GridFilteringFilterMenu, GridFilteringFilterBuilder, GridFooter, GridGrouping, GridGroupingGroupBar, GridGroupingSummaryRow, GridGroupHeader, GridHeader, GridLayout, GridPaging, GridPagingSpinner, GridPager, GridPagerPageSizeSelector, GridPagerSummary, GridPagerNavigationButtons, GridPagerNavigationButtonsPrevNextButtons, GridPagerNavigationButtonsFirstLastButtons, GridPagerNavigationButtonsLabels, GridPagerNavigationInput, GridPagerPageIndexSelectors, GridRowDetail, GridRow, GridCell, GridSummaryRow, GridStateSettings, GridSelection, GridSelectionCheckBoxes, GridSorting, GridUploadSettings, ElementRenderMode} from './../index';\nimport { DataAdapter, Chart } from './../index';\nimport { Component, Directive, AfterViewInit, ElementRef, Input, OnInit, OnChanges, OnDestroy, SimpleChanges, Output, EventEmitter } from '@angular/core';\nimport { BaseElement, Smart } from './smart.element';\nexport { GridAppearanceAutoGenerateRowLabelMode, GridAppearanceAutoGenerateColumnLabelMode, GridResizeMode, GridClipboardAutoFillMode, HorizontalAlignment, VerticalAlignment, Position, GridColumnFilterMenuMode, GridColumnSortOrder, GridConditionalFormattingCondition, GridDataExportPageOrientation, GridDataSourceSettingsSanitizeHTML, GridDataSourceSettingsDataFieldDataType, GridDataSourceSettingsDataSourceType, GridEditingAction, LayoutPosition, GridCommandDisplayMode, GridEditingMode, GridEditingAddNewRowDisplayMode, GridFilteringFilterRowApplyMode, GridFilteringFilterMenuMode, GridGroupingExpandMode, GridGroupingRenderMode, GridHeaderSearchCommand, GridPagerAutoEllipsis, Scrolling, GridSelectionMode, GridSelectionAction, GridSelectionCheckBoxesSelectAllMode, GridSortingMode, GridSortingCommandKey, GridAppearance, GridBehavior, GridColumnHeader, GridClipboard, GridColumn, GridContextMenu, GridContextMenuDataSource, GridCommand, GridColumnMenu, GridColumnMenuDataSource, GridColumnGroup, GridConditionalFormatting, GridCharting, Dialog, GridCheckBoxes, GridDataExport, GridDataSourceSettings, GridDataSourceSettingsDataField, GridEditing, GridEditingCommandKeys, GridCommandKey, GridEditingCommandBar, GridEditingCommandBarDataSource, GridEditingCommandColumn, GridEditingCommandColumnDataSource, GridEditingAddNewRow, GridEditingAddNewColumn, GridFiltering, GridFilteringFilterRow, GridFilteringFilterMenu, GridFilteringFilterBuilder, GridFooter, GridGrouping, GridGroupingGroupBar, GridGroupingSummaryRow, GridGroupHeader, GridHeader, GridLayout, GridPaging, GridPagingSpinner, GridPager, GridPagerPageSizeSelector, GridPagerSummary, GridPagerNavigationButtons, GridPagerNavigationButtonsPrevNextButtons, GridPagerNavigationButtonsFirstLastButtons, GridPagerNavigationButtonsLabels, GridPagerNavigationInput, GridPagerPageIndexSelectors, GridRowDetail, GridRow, GridCell, GridSummaryRow, GridStateSettings, GridSelection, GridSelectionCheckBoxes, GridSorting, GridUploadSettings, ElementRenderMode} from './../index';\nexport { Smart } from './smart.element';\nexport { Grid } from './../index';\nexport { DataAdapter, Chart } from './../index';\n\n\n@Directive({\n\texportAs: 'smart-grid',\tselector: 'smart-grid, [smart-grid]'\n})\n\nexport class GridComponent extends BaseElement implements OnInit, AfterViewInit, OnDestroy, OnChanges {\n\tconstructor(ref: ElementRef<Grid>) {\n\t\tsuper(ref);\n\t\tthis.nativeElement = ref.nativeElement as Grid;\n\t}\n\n\tprivate eventHandlers: any[] = [];\n\n\tpublic declare nativeElement: Grid;\n\t/** @description Creates the component on demand.\n\t * @param properties An optional object of properties, which will be added to the template binded ones.\n\t */\n\tpublic createComponent(properties = {}): any {\n \tthis.nativeElement = <Grid>document.createElement('smart-grid');\n\t\tfor (let propertyName in properties) { \n \t\t\tthis.nativeElement[propertyName] = properties[propertyName];\n\t\t}\n\t\treturn this.nativeElement;\n\t}\n\t/** @description An object containing settings related to the grid's appearance. */\n\t@Input()\n\tget appearance(): GridAppearance {\n\t\treturn this.nativeElement ? this.nativeElement.appearance : undefined;\n\t}\n\tset appearance(value: GridAppearance) {\n\t\tthis.nativeElement ? this.nativeElement.appearance = value : undefined;\n\t}\n\n\t/** @description An object containing settings related to the grid's behavior. */\n\t@Input()\n\tget behavior(): GridBehavior {\n\t\treturn this.nativeElement ? this.nativeElement.behavior : undefined;\n\t}\n\tset behavior(value: GridBehavior) {\n\t\tthis.nativeElement ? this.nativeElement.behavior = value : undefined;\n\t}\n\n\t/** @description Sets or gets the id of the current user. Has to correspond to the id of an item from the users property/array. Depending on the current user, different privileges are enabled. If no current user is set, privileges depend on the element's properties. */\n\t@Input()\n\tget currentUser(): string | number {\n\t\treturn this.nativeElement ? this.nativeElement.currentUser : undefined;\n\t}\n\tset currentUser(value: string | number) {\n\t\tthis.nativeElement ? this.nativeElement.currentUser = value : undefined;\n\t}\n\n\t/** @description Describes the column header settings. */\n\t@Input()\n\tget columnHeader(): GridColumnHeader {\n\t\treturn this.nativeElement ? this.nativeElement.columnHeader : undefined;\n\t}\n\tset columnHeader(value: GridColumnHeader) {\n\t\tthis.nativeElement ? this.nativeElement.columnHeader = value : undefined;\n\t}\n\n\t/** @description The clipboard property is used to enable/disable clipboard operations with Ctrl+C, Ctrl+X and Ctrl+V keyboard navigations.. */\n\t@Input()\n\tget clipboard(): GridClipboard {\n\t\treturn this.nativeElement ? this.nativeElement.clipboard : undefined;\n\t}\n\tset clipboard(value: GridClipboard) {\n\t\tthis.nativeElement ? this.nativeElement.clipboard = value : undefined;\n\t}\n\n\t/** @description The columns property is used to describe all columns displayed in the grid. */\n\t@Input()\n\tget columns(): {label: string, dataField: string}[] | string[] | number | GridColumn[] {\n\t\treturn this.nativeElement ? this.nativeElement.columns : undefined;\n\t}\n\tset columns(value: {label: string, dataField: string}[] | string[] | number | GridColumn[]) {\n\t\tthis.nativeElement ? this.nativeElement.columns = value : undefined;\n\t}\n\n\t/** @description Context Menu is the drop-down menu displayed after right-clicking a Grid row. It allows you to delete row, edit cell or row depending on the edit mode. The 'contextMenuItemCustom' dataSource option allows you to add custom menu item to the context menu. You can replace the context menu by using the 'selector' property and setting it to ID of a Smart.Menu component. */\n\t@Input()\n\tget contextMenu(): GridContextMenu {\n\t\treturn this.nativeElement ? this.nativeElement.contextMenu : undefined;\n\t}\n\tset contextMenu(value: GridContextMenu) {\n\t\tthis.nativeElement ? this.nativeElement.contextMenu = value : undefined;\n\t}\n\n\t/** @description Column Menu is the drop-down menu displayed after clicking the column header's drop-down button, which is displayed when you hover the column header. It allows you to customize column settings. For example: Sort, Filter or Group the Grid by the current column. */\n\t@Input()\n\tget columnMenu(): GridColumnMenu {\n\t\treturn this.nativeElement ? this.nativeElement.columnMenu : undefined;\n\t}\n\tset columnMenu(value: GridColumnMenu) {\n\t\tthis.nativeElement ? this.nativeElement.columnMenu = value : undefined;\n\t}\n\n\t/** @description Describes the settings of the column groups. */\n\t@Input()\n\tget columnGroups(): GridColumnGroup[] {\n\t\treturn this.nativeElement ? this.nativeElement.columnGroups : undefined;\n\t}\n\tset columnGroups(value: GridColumnGroup[]) {\n\t\tthis.nativeElement ? this.nativeElement.columnGroups = value : undefined;\n\t}\n\n\t/** @description */\n\t@Input()\n\tget dropDownMode(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownMode : undefined;\n\t}\n\tset dropDownMode(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownMode = value : undefined;\n\t}\n\n\t/** @description Sets or gets details about conditional formatting to be applied to the Grid's cells. */\n\t@Input()\n\tget conditionalFormatting(): GridConditionalFormatting[] {\n\t\treturn this.nativeElement ? this.nativeElement.conditionalFormatting : undefined;\n\t}\n\tset conditionalFormatting(value: GridConditionalFormatting[]) {\n\t\tthis.nativeElement ? this.nativeElement.conditionalFormatting = value : undefined;\n\t}\n\n\t/** @description Sets the Grid Charting Data Visualization. */\n\t@Input()\n\tget charting(): GridCharting {\n\t\treturn this.nativeElement ? this.nativeElement.charting : undefined;\n\t}\n\tset charting(value: GridCharting) {\n\t\tthis.nativeElement ? this.nativeElement.charting = value : undefined;\n\t}\n\n\t/** @description Sets the TreeGrid checkboxes. */\n\t@Input()\n\tget checkBoxes(): GridCheckBoxes {\n\t\treturn this.nativeElement ? this.nativeElement.checkBoxes : undefined;\n\t}\n\tset checkBoxes(value: GridCheckBoxes) {\n\t\tthis.nativeElement ? this.nativeElement.checkBoxes = value : undefined;\n\t}\n\n\t/** @description Sets the Grid Data Export options. */\n\t@Input()\n\tget dataExport(): GridDataExport {\n\t\treturn this.nativeElement ? this.nativeElement.dataExport : undefined;\n\t}\n\tset dataExport(value: GridDataExport) {\n\t\tthis.nativeElement ? this.nativeElement.dataExport = value : undefined;\n\t}\n\n\t/** @description Sets the grid's data source. The value of dataSource can be an instance of JQX.DataAdapter or an Array. */\n\t@Input()\n\tget dataSource(): any {\n\t\treturn this.nativeElement ? this.nativeElement.dataSource : undefined;\n\t}\n\tset dataSource(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.dataSource = value : undefined;\n\t}\n\n\t/** @description Sets the grid's data source settings when the dataSource property is set to an Array or URL. */\n\t@Input()\n\tget dataSourceSettings(): GridDataSourceSettings {\n\t\treturn this.nativeElement ? this.nativeElement.dataSourceSettings : undefined;\n\t}\n\tset dataSourceSettings(value: GridDataSourceSettings) {\n\t\tthis.nativeElement ? this.nativeElement.dataSourceSettings = value : undefined;\n\t}\n\n\t/** @description Describes the grid's editing settings. */\n\t@Input()\n\tget editing(): GridEditing {\n\t\treturn this.nativeElement ? this.nativeElement.editing : undefined;\n\t}\n\tset editing(value: GridEditing) {\n\t\tthis.nativeElement ? this.nativeElement.editing = value : undefined;\n\t}\n\n\t/** @description Describes the grid's filtering settings. */\n\t@Input()\n\tget filtering(): GridFiltering {\n\t\treturn this.nativeElement ? this.nativeElement.filtering : undefined;\n\t}\n\tset filtering(value: GridFiltering) {\n\t\tthis.nativeElement ? this.nativeElement.filtering = value : undefined;\n\t}\n\n\t/** @description Describes the footer settings of the grid. */\n\t@Input()\n\tget footer(): GridFooter {\n\t\treturn this.nativeElement ? this.nativeElement.footer : undefined;\n\t}\n\tset footer(value: GridFooter) {\n\t\tthis.nativeElement ? this.nativeElement.footer = value : undefined;\n\t}\n\n\t/** @description Sets or gets whether Excel-like formulas can be passed as cell values. Formulas are always preceded by the = sign and are re-evaluated when cell values are changed. This feature depends on the third-party free plug-in formula-parser (the file formula-parser.min.js has to be referenced). */\n\t@Input()\n\tget formulas(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.formulas : undefined;\n\t}\n\tset formulas(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.formulas = value : undefined;\n\t}\n\n\t/** @description Describes the grid's grouping settings. */\n\t@Input()\n\tget grouping(): GridGrouping {\n\t\treturn this.nativeElement ? this.nativeElement.grouping : undefined;\n\t}\n\tset grouping(value: GridGrouping) {\n\t\tthis.nativeElement ? this.nativeElement.grouping = value : undefined;\n\t}\n\n\t/** @description Describes the settings for the group header. */\n\t@Input()\n\tget groupHeader(): GridGroupHeader {\n\t\treturn this.nativeElement ? this.nativeElement.groupHeader : undefined;\n\t}\n\tset groupHeader(value: GridGroupHeader) {\n\t\tthis.nativeElement ? this.nativeElement.groupHeader = value : undefined;\n\t}\n\n\t/** @description Describes the header settings of the grid. */\n\t@Input()\n\tget header(): GridHeader {\n\t\treturn this.nativeElement ? this.nativeElement.header : undefined;\n\t}\n\tset header(value: GridHeader) {\n\t\tthis.nativeElement ? this.nativeElement.header = value : undefined;\n\t}\n\n\t/** @description An object containing settings related to the grid's layout. */\n\t@Input()\n\tget layout(): GridLayout {\n\t\treturn this.nativeElement ? this.nativeElement.layout : undefined;\n\t}\n\tset layout(value: GridLayout) {\n\t\tthis.nativeElement ? this.nativeElement.layout = value : undefined;\n\t}\n\n\t/** @description Sets or gets the license which unlocks the product. */\n\t@Input()\n\tget license(): string {\n\t\treturn this.nativeElement ? this.nativeElement.license : undefined;\n\t}\n\tset license(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.license = value : undefined;\n\t}\n\n\t/** @description Sets or gets the language. Used in conjunction with the property messages. */\n\t@Input()\n\tget locale(): string {\n\t\treturn this.nativeElement ? this.nativeElement.locale : undefined;\n\t}\n\tset locale(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.locale = value : undefined;\n\t}\n\n\t/** @description Sets the messages values. */\n\t@Input()\n\tget messages(): any {\n\t\treturn this.nativeElement ? this.nativeElement.messages : undefined;\n\t}\n\tset messages(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.messages = value : undefined;\n\t}\n\n\t/** @description Callback function(chart: JQX.Chart) called when the chart has been initialized. You can use this function to customize the Chart element settings. */\n\t@Input()\n\tget onCellValue(): {(cell: GridCell): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onCellValue : undefined;\n\t}\n\tset onCellValue(value: {(cell: GridCell): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onCellValue = value : undefined;\n\t}\n\n\t/** @description Callback function() called when the grid has been rendered. */\n\t@Input()\n\tget onCellUpdate(): {(cells: GridCell[], oldValues: any[], values: any[], confirm: {(commit: boolean): void}): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onCellUpdate : undefined;\n\t}\n\tset onCellUpdate(value: {(cells: GridCell[], oldValues: any[], values: any[], confirm: {(commit: boolean): void}): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onCellUpdate = value : undefined;\n\t}\n\n\t/** @description Callback function() called when the grid has been rendered for first time and bindings are completed. The component is ready. */\n\t@Input()\n\tget onCellRender(): {(cell: GridCell): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onCellRender : undefined;\n\t}\n\tset onCellRender(value: {(cell: GridCell): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onCellRender = value : undefined;\n\t}\n\n\t/** @description Describes the paging settings. */\n\t@Input()\n\tget onCellBeginEdit(): {(id: string, dataField: string, value: any): boolean} {\n\t\treturn this.nativeElement ? this.nativeElement.onCellBeginEdit : undefined;\n\t}\n\tset onCellBeginEdit(value: {(id: string, dataField: string, value: any): boolean}) {\n\t\tthis.nativeElement ? this.nativeElement.onCellBeginEdit = value : undefined;\n\t}\n\n\t/** @description Describes the pager settings. */\n\t@Input()\n\tget onCellEditRequest(): {(id: string, dataField: string, value: any, oldValue: any, data: any): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onCellEditRequest : undefined;\n\t}\n\tset onCellEditRequest(value: {(id: string, dataField: string, value: any, oldValue: any, data: any): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onCellEditRequest = value : undefined;\n\t}\n\n\t/** @description Sets the row details. */\n\t@Input()\n\tget onBeforeInit(): {(): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onBeforeInit : undefined;\n\t}\n\tset onBeforeInit(value: {(): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onBeforeInit = value : undefined;\n\t}\n\n\t/** @description Sets or gets the rows CSS class rules. Different CSS class names are conditionally applied. Example: rowCSSRules: { 'cell-class-1': settings =&gt; settings.data.quantity === 5, 'cell-class-2': settings =&gt; settings.data.quantity &lt; 5, 'cell-class-3': settings =&gt; settings.data.quantity &gt; 5 }. The settings object contains the following properties: index, data, row, api. */\n\t@Input()\n\tget onInit(): {(): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onInit : undefined;\n\t}\n\tset onInit(value: {(): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onInit = value : undefined;\n\t}\n\n\t/** @description Sets or gets the value indicating whether the element is aligned to support locales using right-to-left fonts. */\n\t@Input()\n\tget onAfterInit(): {(): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onAfterInit : undefined;\n\t}\n\tset onAfterInit(value: {(): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onAfterInit = value : undefined;\n\t}\n\n\t/** @description The rows property is used to describe all rows displayed in the grid. */\n\t@Input()\n\tget onChartInit(): any {\n\t\treturn this.nativeElement ? this.nativeElement.onChartInit : undefined;\n\t}\n\tset onChartInit(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.onChartInit = value : undefined;\n\t}\n\n\t/** @description Sets the scroll mode settings. */\n\t@Input()\n\tget onRender(): any {\n\t\treturn this.nativeElement ? this.nativeElement.onRender : undefined;\n\t}\n\tset onRender(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.onRender = value : undefined;\n\t}\n\n\t/** @description Describes the summary row settings. */\n\t@Input()\n\tget onLoad(): any {\n\t\treturn this.nativeElement ? this.nativeElement.onLoad : undefined;\n\t}\n\tset onLoad(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.onLoad = value : undefined;\n\t}\n\n\t/** @description Sets the grid's state settings. */\n\t@Input()\n\tget onKey(): {(event: KeyboardEvent): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onKey : undefined;\n\t}\n\tset onKey(value: {(event: KeyboardEvent): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onKey = value : undefined;\n\t}\n\n\t/** @description Describes the selection settings. */\n\t@Input()\n\tget onRowInit(): {(index: number, row: GridRow): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowInit : undefined;\n\t}\n\tset onRowInit(value: {(index: number, row: GridRow): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowInit = value : undefined;\n\t}\n\n\t/** @description Describes sorting settings. */\n\t@Input()\n\tget onRowDetailInit(): {(index: number, row: GridRow, details: HTMLElement): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowDetailInit : undefined;\n\t}\n\tset onRowDetailInit(value: {(index: number, row: GridRow, details: HTMLElement): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowDetailInit = value : undefined;\n\t}\n\n\t/** @description Sets the grid users. Expects an array with 'id', 'name' and optionally 'color' and 'image' properties. */\n\t@Input()\n\tget onRowDetailUpdated(): {(index: number, row: GridRow, details: HTMLElement): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowDetailUpdated : undefined;\n\t}\n\tset onRowDetailUpdated(value: {(index: number, row: GridRow, details: HTMLElement): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowDetailUpdated = value : undefined;\n\t}\n\n\t/** @description Sets the grid's image and filter upload settings for the image and attachment columns. */\n\t@Input()\n\tget onRowHistory(): {(index: number, row: GridRow, history: any[]): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowHistory : undefined;\n\t}\n\tset onRowHistory(value: {(index: number, row: GridRow, history: any[]): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowHistory = value : undefined;\n\t}\n\n\t/** @description Sets the current data view. The possible values are 'grid', 'kanban' and 'card'. */\n\t@Input()\n\tget onRowStyle(): {(index: number, row: GridRow, history: any[]): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowStyle : undefined;\n\t}\n\tset onRowStyle(value: {(index: number, row: GridRow, history: any[]): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowStyle = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onRowInserted(): {(index: number[], row: GridRow[]): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowInserted : undefined;\n\t}\n\tset onRowInserted(value: {(index: number[], row: GridRow[]): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowInserted = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onRowRemoved(): {(indexes: number[], rows: GridRow[]): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowRemoved : undefined;\n\t}\n\tset onRowRemoved(value: {(indexes: number[], rows: GridRow[]): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowRemoved = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onRowUpdate(): {(index: number[], row: GridRow[], oldValues: any[], values: any[], confirm: {(commit: boolean): void}): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowUpdate : undefined;\n\t}\n\tset onRowUpdate(value: {(index: number[], row: GridRow[], oldValues: any[], values: any[], confirm: {(commit: boolean): void}): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowUpdate = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onRowUpdated(): {(index: number[], row: GridRow[]): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowUpdated : undefined;\n\t}\n\tset onRowUpdated(value: {(index: number[], row: GridRow[]): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowUpdated = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onRowClass(): {(index: number, data: any, row: GridRow[]): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onRowClass : undefined;\n\t}\n\tset onRowClass(value: {(index: number, data: any, row: GridRow[]): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onRowClass = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onCellClass(): {(index: number, dataField: string, cellValue: any, data: any, row: GridRow[]): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onCellClass : undefined;\n\t}\n\tset onCellClass(value: {(index: number, dataField: string, cellValue: any, data: any, row: GridRow[]): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onCellClass = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onColumnInit(): {(index: number, column: GridColumn): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onColumnInit : undefined;\n\t}\n\tset onColumnInit(value: {(index: number, column: GridColumn): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onColumnInit = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onColumnInserted(): {(index: number, column: GridColumn): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onColumnInserted : undefined;\n\t}\n\tset onColumnInserted(value: {(index: number, column: GridColumn): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onColumnInserted = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onColumnRemoved(): {(index: number, column: GridColumn): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onColumnRemoved : undefined;\n\t}\n\tset onColumnRemoved(value: {(index: number, column: GridColumn): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onColumnRemoved = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onColumnUpdated(): {(index: number, column: GridColumn): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onColumnUpdated : undefined;\n\t}\n\tset onColumnUpdated(value: {(index: number, column: GridColumn): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onColumnUpdated = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onColumnClone(): {(dataField: string, cloneColumnDataField: string, index: number, duplicateCells: boolean): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onColumnClone : undefined;\n\t}\n\tset onColumnClone(value: {(dataField: string, cloneColumnDataField: string, index: number, duplicateCells: boolean): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onColumnClone = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget onCommand(): {(name: string, command: any, details: GridCell, event: Event | KeyboardEvent | PointerEvent, handled: boolean): void} {\n\t\treturn this.nativeElement ? this.nativeElement.onCommand : undefined;\n\t}\n\tset onCommand(value: {(name: string, command: any, details: GridCell, event: Event | KeyboardEvent | PointerEvent, handled: boolean): void}) {\n\t\tthis.nativeElement ? this.nativeElement.onCommand = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget paging(): GridPaging {\n\t\treturn this.nativeElement ? this.nativeElement.paging : undefined;\n\t}\n\tset paging(value: GridPaging) {\n\t\tthis.nativeElement ? this.nativeElement.paging = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget pager(): GridPager {\n\t\treturn this.nativeElement ? this.nativeElement.pager : undefined;\n\t}\n\tset pager(value: GridPager) {\n\t\tthis.nativeElement ? this.nativeElement.pager = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget rowDetail(): GridRowDetail {\n\t\treturn this.nativeElement ? this.nativeElement.rowDetail : undefined;\n\t}\n\tset rowDetail(value: GridRowDetail) {\n\t\tthis.nativeElement ? this.nativeElement.rowDetail = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget rowCSSRules(): any {\n\t\treturn this.nativeElement ? this.nativeElement.rowCSSRules : undefined;\n\t}\n\tset rowCSSRules(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.rowCSSRules = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget rightToLeft(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.rightToLeft : undefined;\n\t}\n\tset rightToLeft(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.rightToLeft = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget rows(): GridRow[] {\n\t\treturn this.nativeElement ? this.nativeElement.rows : undefined;\n\t}\n\tset rows(value: GridRow[]) {\n\t\tthis.nativeElement ? this.nativeElement.rows = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget scrolling(): Scrolling | string {\n\t\treturn this.nativeElement ? this.nativeElement.scrolling : undefined;\n\t}\n\tset scrolling(value: Scrolling | string) {\n\t\tthis.nativeElement ? this.nativeElement.scrolling = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget summaryRow(): GridSummaryRow {\n\t\treturn this.nativeElement ? this.nativeElement.summaryRow : undefined;\n\t}\n\tset summaryRow(value: GridSummaryRow) {\n\t\tthis.nativeElement ? this.nativeElement.summaryRow = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget stateSettings(): GridStateSettings {\n\t\treturn this.nativeElement ? this.nativeElement.stateSettings : undefined;\n\t}\n\tset stateSettings(value: GridStateSettings) {\n\t\tthis.nativeElement ? this.nativeElement.stateSettings = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget selection(): GridSelection {\n\t\treturn this.nativeElement ? this.nativeElement.selection : undefined;\n\t}\n\tset selection(value: GridSelection) {\n\t\tthis.nativeElement ? this.nativeElement.selection = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget sorting(): GridSorting {\n\t\treturn this.nativeElement ? this.nativeElement.sorting : undefined;\n\t}\n\tset sorting(value: GridSorting) {\n\t\tthis.nativeElement ? this.nativeElement.sorting = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget users(): any[] {\n\t\treturn this.nativeElement ? this.nativeElement.users : undefined;\n\t}\n\tset users(value: any[]) {\n\t\tthis.nativeElement ? this.nativeElement.users = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget uploadSettings(): GridUploadSettings {\n\t\treturn this.nativeElement ? this.nativeElement.uploadSettings : undefined;\n\t}\n\tset uploadSettings(value: GridUploadSettings) {\n\t\tthis.nativeElement ? this.nativeElement.uploadSettings = value : undefined;\n\t}\n\n\t/** @description undefined */\n\t@Input()\n\tget view(): string {\n\t\treturn this.nativeElement ? this.nativeElement.view : undefined;\n\t}\n\tset view(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.view = value : undefined;\n\t}\n\n\t/** @description This event is triggered, when the edit begins. After the event occurs, editing starts. If you need to prevent the editing for specific cells, rows or columns, you can call event.preventDefault();.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tid, \tdataField, \trow, \tcolumn, \tcell, \tdata, \tvalue)\n\t* id - The edited row id.\n\t* dataField - The edited column data field.\n\t* row - The edited row.\n\t* column - The edited column.\n\t* cell - The edited cell.\n\t* data - The edited row's data.\n\t* value - The edited cell's value.\n\t*/\n\t@Output() onBeginEdit: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the Grid's header toolbar is displayed and the 'OK' button of a header dropdown is clicked. For example, when you open the columns customize panel, reorder columns and click the 'OK' button.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\ttype)\n\t* type - The type of dropdown. Possible values: 'filter', 'sort', 'search', 'group', 'format', 'customize'\n\t*/\n\t@Output() onBatchChange: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the Grid's header toolbar is displayed and the 'Cancel' button of a header dropdown is clicked.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\ttype)\n\t* type - The type of dropdown. Possible values: 'filter', 'sort', 'search', 'group', 'format', 'customize'\n\t*/\n\t@Output() onBatchCancel: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the selection is changed. When you select with a drag, the event is triggered when the drag starts and ends. \n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tstarted, \tfinished, \toriginalEvent)\n\t* started - The flag is <em>true</em>, when the selection starts. The flag is <em>false</em>, when the selection ends and when the user changes the selection by dragging.\n\t* finished - The flag is <em>true</em>, when the selection ends. The flag is <em>false</em>, when the selection starts and when the user changes the selection by dragging.\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t*/\n\t@Output() onChange: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user clicks on the header of a column.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tdataField, \toriginalEvent)\n\t* column - The clicked column.\n\t* dataField - The column's data field.\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t*/\n\t@Output() onColumnClick: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user double clicks on the header of a column.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tdataField, \toriginalEvent)\n\t* column - The double-clicked column.\n\t* dataField - The column's data field.\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t*/\n\t@Output() onColumnDoubleClick: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user resized a column.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tdataField, \toldWidth, \twidth)\n\t* column - The resized column.\n\t* dataField - The column's data field.\n\t* oldWidth - The old width of the column.\n\t* width - The new width of the column.\n\t*/\n\t@Output() onColumnResize: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user starts a column drag.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tdataField, \tindex, \toriginalEvent)\n\t* column - The column.\n\t* dataField - The column's data field.\n\t* index - The column's index\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onColumnDragStart: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when a column property is changed.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tpropertyName, \toldValue, \tvalue)\n\t* column - The resized column.\n\t* propertyName - The changed property's name.\n\t* oldValue - The old value(s) of the column.\n\t* value - The new value(s) of the column.\n\t*/\n\t@Output() onColumnChange: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user drags a column.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tdataField, \tindex, \tdata, \toriginalEvent)\n\t* column - The column.\n\t* dataField - The column's data field.\n\t* index - The column's index\n\t* data - The dragging object. data.feedback and data.feedbackLine are HTML Elements which are displayed while the user drags. The object has error(), success() and data() methods which you can call to set the feedback state.\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onColumnDragging: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user drops a column.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tdataField, \tindex, \tnewIndex, \tdata, \toriginalEvent)\n\t* column - The column.\n\t* dataField - The column's data field.\n\t* index - The column's index\n\t* newIndex - The column's new index\n\t* data - The dragging object. data.feedback and data.feedbackLine are HTML Elements which are displayed while the user drags. The object has error(), success() and data() methods which you can call to set the feedback state.\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onColumnDragEnd: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user reorders a column.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tcolumn, \tdataField, \tindex, \tnewIndex, \tdata, \toriginalEvent)\n\t* column - The column.\n\t* dataField - The column's data field.\n\t* index - The column's index\n\t* newIndex - The column's new index\n\t* data - The dragging object. data.feedback and data.feedbackLine are HTML Elements which are displayed while the user drags. The object has error(), success() and data() methods which you can call to set the feedback state.\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onColumnReorder: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user enters a comment in the row edit dialog.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tid, \tcomment)\n\t* id - The row's id.\n\t* comment - The comment object. The comment object has 'text: string', 'id: string', 'userId: string | number', and 'time: date' fields. The 'text' is the comment's text. 'id' is the comment's unique id, 'userId' is the user's id who entered the comment and 'time' is a javascript date object.\n\t*/\n\t@Output() onCommentAdd: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user removes a comment in the row edit dialog.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tid, \tcomment)\n\t* id - The row's id.\n\t* comment - The comment object. The comment object has 'text: string', 'id: string', 'userId: string | number', and 'time: date' fields. The 'text' is the comment's text. 'id' is the comment's unique id, 'userId' is the user's id who entered the comment and 'time' is a javascript date object.\n\t*/\n\t@Output() onCommentRemove: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user clicks on a context menu item.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\tid, \tdataField, \tcommand)\n\t* id - The row's id.\n\t* dataField - The column's data field.\n\t* command - Command function.\n\t*/\n\t@Output() onContextMenuItemClick: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user starts a row drag.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \tid, \tindex, \toriginalEvent)\n\t* row - The row.\n\t* id - The row's id\n\t* index - The row's index\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onRowDragStart: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user drags a row.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \tid, \tindex, \tdata, \toriginalEvent)\n\t* row - The row.\n\t* id - The row's id\n\t* index - The row's index\n\t* data - The dragging object. data.feedback and data.feedbackLine are HTML Elements which are displayed while the user drags. The object has error(), success() and data() methods which you can call to set the feedback state.\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onRowDragging: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user drags a row.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \tid, \tindex, \tnewIndex, \tdata, \toriginalEvent)\n\t* row - The row.\n\t* id - The row's id\n\t* index - The row's index\n\t* newIndex - The row's new index\n\t* data - The dragging object. data.feedback and data.feedbackLine are HTML Elements which are displayed while the user drags. The object has error(), success() and data() methods which you can call to set the feedback state.\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onRowDragEnd: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user reorders a row.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \tid, \tindex, \tnewIndex, \tdata, \toriginalEvent)\n\t* row - The row.\n\t* id - The row's id\n\t* index - The row's index\n\t* newIndex - The row's new index\n\t* data - The dragging object. data.feedback and data.feedbackLine are HTML Elements which are displayed while the user drags. The object has error(), success() and data() methods which you can call to set the feedback state.\n\t* originalEvent - The origianl Event object.\n\t*/\n\t@Output() onRowReorder: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user expands a row of the grid. The Grid is in TreeGrid/Grouping mode.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \tid, \toriginalEvent)\n\t* row - The expanded row.\n\t* id - The row's id\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t*/\n\t@Output() onRowExpand: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user collapsed a row of the grid. The Grid is in TreeGrid/Grouping mode.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \tid, \toriginalEvent)\n\t* row - The collapsed row. \n\t* id - The row's id\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t*/\n\t@Output() onRowCollapse: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user clicks on a row of the grid.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \toriginalEvent, \tid, \tdata, \tisRightClick, \tpageX, \tpageY)\n\t* row - The clicked row.\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t* id - Gets the row id.\n\t* data - Gets the row data.\n\t* isRightClick - Gets whether the pointing device's right button is clicked.\n\t* pageX - Gets the click's X position.\n\t* pageY - Gets the click's Y position.\n\t*/\n\t@Output() onRowClick: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user double clicks on a row of the grid.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \toriginalEvent, \tid, \tdata, \tisRightClick, \tpageX, \tpageY)\n\t* row - The double-clicked row.\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t* id - Gets the row id.\n\t* data - Gets the row data.\n\t* isRightClick - Gets whether the pointing device's right button is clicked.\n\t* pageX - Gets the click's X position.\n\t* pageY - Gets the click's Y position.\n\t*/\n\t@Output() onRowDoubleClick: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user resized a row.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \tid, \toldHeight, \theight)\n\t* row - The resized row.\n\t* id - Gets the row id.\n\t* oldHeight - The old height of the row.\n\t* height - The new height of the row.\n\t*/\n\t@Output() onRowResize: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user clicks on the row header's star.\n\t* @param event. The custom event. \tCustom event was created with: event.detail(\trow, \toriginalEvent, \tid, \tvalue)\n\t* row - The clicked row.\n\t* originalEvent - The original event object, which is 'pointer', 'touch' or 'mouse' Event object, depending on the device type and web browser\n\t* id - Gets the row id.\n\t* value - Gets whether the row is starred or not.\n\t*/\n\t@Output() onRowStarred: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered, when the user clicks