colDef.d.ts 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359
  1. import { RowNode } from "./rowNode";
  2. import { ICellEditorComp, ICellEditorParams } from "../interfaces/iCellEditor";
  3. import { ICellRendererComp, ICellRendererFunc, ICellRendererParams } from "../rendering/cellRenderers/iCellRenderer";
  4. import { Column } from "./column";
  5. import { IFilterComp } from "../interfaces/iFilter";
  6. import { GridApi } from "../gridApi";
  7. import { ColumnApi } from "../columnController/columnApi";
  8. import { IHeaderGroupComp } from "../headerRendering/headerGroup/headerGroupComp";
  9. import { IFloatingFilterComp } from "../filter/floating/floatingFilter";
  10. import { CellClickedEvent, CellContextMenuEvent, CellDoubleClickedEvent } from "../events";
  11. import { ITooltipComp, ITooltipParams } from "../rendering/tooltipComponent";
  12. import { ComponentSelectorResult } from "../components/framework/userComponentFactory";
  13. import { IRowDragItem } from "../rendering/rowDragComp";
  14. /****************************************************************
  15. * Don't forget to update ComponentUtil if changing this class. PLEASE!*
  16. ****************************************************************/
  17. /** AbstractColDef can be a group or a column definition */
  18. export interface AbstractColDef {
  19. /** The name to render in the column header */
  20. headerName?: string;
  21. /** Whether to show the column when the group is open / closed. */
  22. columnGroupShow?: string;
  23. /** CSS class for the header */
  24. headerClass?: string | string[] | ((params: any) => string | string[]);
  25. /** CSS class for the header */
  26. toolPanelClass?: string | string[] | ((params: any) => string | string[]);
  27. /** Expression or function to get the cells value. */
  28. headerValueGetter?: string | Function;
  29. /** Never set this, it is used internally by grid when doing in-grid pivoting */
  30. pivotKeys?: string[];
  31. /** @deprecated since v22 - use suppressColumnsToolPanel / suppressFiltersToolPanel instead */
  32. suppressToolPanel?: boolean;
  33. /** Set to true to not include this column in the Columns Tool Panel */
  34. suppressColumnsToolPanel?: boolean;
  35. /** Set to true to not include this column / filter in the Filters Tool Panel */
  36. suppressFiltersToolPanel?: boolean;
  37. /** Tooltip for the column header */
  38. headerTooltip?: string;
  39. tooltipComponent?: {
  40. new (): ITooltipComp;
  41. } | string;
  42. tooltipComponentFramework?: any;
  43. tooltipComponentParams?: any;
  44. }
  45. export interface ColGroupDef extends AbstractColDef {
  46. /** Columns in this group */
  47. children: (ColDef | ColGroupDef)[];
  48. /** Group ID */
  49. groupId?: string;
  50. /** Open by Default */
  51. openByDefault?: boolean;
  52. /** If true, group cannot be broken up by column moving, child columns will always appear side by side, however you can rearrange child columns within the group */
  53. marryChildren?: boolean;
  54. /** The custom header group component to be used for rendering the component header. If none specified the default ag-Grid is used**/
  55. headerGroupComponent?: string | {
  56. new (): IHeaderGroupComp;
  57. };
  58. /** The custom header group component to be used for rendering the component header in the hosting framework (ie: React/Angular). If none specified the default ag-Grid is used**/
  59. headerGroupComponentFramework?: any;
  60. /** The custom header group component to be used for rendering the component header. If none specified the default ag-Grid is used**/
  61. headerGroupComponentParams?: any;
  62. }
  63. export interface IAggFunc {
  64. (input: any[]): any;
  65. }
  66. /****************************************************************
  67. * Don't forget to update ComponentUtil if changing this class. PLEASE!*
  68. ****************************************************************/
  69. export interface ColDef extends AbstractColDef {
  70. /** The unique ID to give the column. This is optional. If missing, the ID will default to the field.
  71. * If both field and colId are missing, a unique ID will be generated.
  72. * This ID is used to identify the column in the API for sorting, filtering etc. */
  73. colId?: string;
  74. /** If sorting by default, set it here. Set to 'asc' or 'desc' */
  75. sort?: string;
  76. /** If sorting more than one column by default, the milliseconds when this column was sorted, so we know what order to sort the columns in. */
  77. sortedAt?: number;
  78. /** The sort order, provide an array with any of the following in any order ['asc','desc',null] */
  79. sortingOrder?: (string | null)[];
  80. /** The field of the row to get the cells data from */
  81. field?: string;
  82. /**
  83. * A comma separated string or array of strings containing ColumnType keys which can be used as a template for a column.
  84. * This helps to reduce duplication of properties when you have a lot of common column properties.
  85. */
  86. type?: string | string[];
  87. /** Set to true for this column to be hidden. Naturally you might think, it would make more sense to call this field 'visible' and mark it false to hide,
  88. * however we want all default values to be false and we want columns to be visible by default. */
  89. hide?: boolean;
  90. /** Whether this column is pinned or not. */
  91. pinned?: boolean | string;
  92. /** The field where we get the tooltip on the object */
  93. tooltipField?: string;
  94. /** @deprecated since v20.1, use colDef.tooltipValueGetter instead*/
  95. tooltip?: (params: ITooltipParams) => string;
  96. /** The function used to calculate the tooltip of the object, tooltipField takes precedence*/
  97. tooltipValueGetter?: (params: ITooltipParams) => string;
  98. /** Expression or function to get the cells value. */
  99. valueGetter?: ((params: ValueGetterParams) => any) | string;
  100. /** Expression or function to get the cells value for filtering. */
  101. filterValueGetter?: ((params: ValueGetterParams) => any) | string;
  102. /** If not using a field, then this puts the value into the cell */
  103. valueSetter?: ((params: ValueSetterParams) => boolean) | string;
  104. /** Function to return the key for a value - use this if the value is an object (not a primitive type) and you
  105. * want to a) group by this field or b) use set filter on this field. */
  106. keyCreator?: (value: any) => string;
  107. /** Initial width, in pixels, of the cell */
  108. width?: number;
  109. /** Min width, in pixels, of the cell */
  110. minWidth?: number;
  111. /** Max width, in pixels, of the cell */
  112. maxWidth?: number;
  113. /** Sets the grow factor of a column. It specifies how much of the remaining
  114. * space should be assigned to the column.
  115. */
  116. flex?: number;
  117. /** True if this column should stretch rows height to fit contents */
  118. autoHeight?: boolean;
  119. /** Class to use for the cell. Can be string, array of strings, or function. */
  120. cellClass?: string | string[] | ((cellClassParams: CellClassParams) => string | string[]);
  121. /** An object of css values. Or a function returning an object of css values. */
  122. cellStyle?: {} | ((params: any) => {});
  123. /** A function for rendering a cell. */
  124. cellRenderer?: {
  125. new (): ICellRendererComp;
  126. } | ICellRendererFunc | string;
  127. cellRendererFramework?: any;
  128. cellRendererParams?: any;
  129. cellRendererSelector?: (params: ICellRendererParams) => ComponentSelectorResult;
  130. /** Cell editor */
  131. cellEditor?: {
  132. new (): ICellEditorComp;
  133. } | string;
  134. cellEditorFramework?: any;
  135. cellEditorParams?: any;
  136. cellEditorSelector?: (params: ICellEditorParams) => ComponentSelectorResult;
  137. /** A function for rendering a pinned row cell. */
  138. pinnedRowCellRenderer?: {
  139. new (): ICellRendererComp;
  140. } | ICellRendererFunc | string;
  141. pinnedRowCellRendererFramework?: any;
  142. pinnedRowCellRendererParams?: any;
  143. /** A function to format a value, should return a string. Not used for CSV export or copy to clipboard, only for UI cell rendering. */
  144. valueFormatter?: ((params: ValueFormatterParams) => string) | string;
  145. /** A function to format a pinned row value, should return a string. Not used for CSV export or copy to clipboard, only for UI cell rendering. */
  146. pinnedRowValueFormatter?: ((params: ValueFormatterParams) => string) | string;
  147. /** Gets called after editing, converts the value in the cell. */
  148. valueParser?: ((params: ValueParserParams) => any) | string;
  149. /** Name of function to use for aggregation. One of [sum,min,max,first,last] or a function. */
  150. aggFunc?: string | IAggFunc;
  151. /** Agg funcs allowed on this column. If missing, all installed agg funcs are allowed.
  152. * Can be eg ['sum','avg']. This will restrict what the GUI allows to select only.*/
  153. allowedAggFuncs?: string[];
  154. /** To group by this column by default, either provide an index (eg rowGroupIndex=1), or set rowGroup=true. */
  155. rowGroupIndex?: number;
  156. rowGroup?: boolean;
  157. /** Set to true to have the grid place the values for the group into the cell, or put the name of a grouped column to just show that group. */
  158. showRowGroup?: string | boolean;
  159. /** To pivot by this column by default, either provide an index (eg pivotIndex=1), or set pivot=true. */
  160. pivotIndex?: number;
  161. pivot?: boolean;
  162. /** Comparator function for custom sorting. */
  163. comparator?: (valueA: any, valueB: any, nodeA: RowNode, nodeB: RowNode, isInverted: boolean) => number;
  164. /** Comparator for values, used by renderer to know if values have changed. Cells who's values have not changed don't get refreshed. */
  165. equals?: (valueA: any, valueB: any) => boolean;
  166. /** Comparator for ordering the pivot columns */
  167. pivotComparator?: (valueA: string, valueB: string) => number;
  168. /** Set to true to render a selection checkbox in the column. */
  169. checkboxSelection?: boolean | ((params: any) => boolean) | null;
  170. /** If true, a 'select all' checkbox will be put into the header */
  171. headerCheckboxSelection?: boolean | ((params: any) => boolean);
  172. /** If true, the header checkbox selection will work on filtered items*/
  173. headerCheckboxSelectionFilteredOnly?: boolean;
  174. /** For grid row dragging, set to true to enable row dragging within the grid */
  175. rowDrag?: boolean | ((params: any) => boolean);
  176. /** To configure the text to be displayed in the floating div while dragging a row when rowDrag is true */
  177. rowDragText?: ((params: IRowDragItem, dragItemCount: number) => string);
  178. /** For native drag and drop, set to true to enable drag source */
  179. dndSource?: boolean | ((params: any) => boolean);
  180. /** For native drag and drop, set to true to allow custom onRowDrag processing */
  181. dndSourceOnRowDrag?: ((params: {
  182. rowNode: RowNode;
  183. dragEvent: DragEvent;
  184. }) => void);
  185. /** Set to true if no menu should be shown for this column header. */
  186. suppressMenu?: boolean;
  187. /** The menu tabs to show, and in which order, the valid values for this property are:
  188. * filterMenuTab, generalMenuTab, columnsMenuTab **/
  189. menuTabs?: string[];
  190. /** Set to true if sorting allowed for this column. */
  191. sortable?: boolean;
  192. /** @deprecated since v20, use colDef.sortable=false instead */
  193. suppressSorting?: boolean;
  194. /** Set to true to not allow moving this column via dragging it's header */
  195. suppressMovable?: boolean;
  196. /** Set to true to not flash this column for value changes */
  197. suppressCellFlash?: boolean;
  198. /** Set to true to make sure this column is always first. Other columns, if movable, cannot move before this column. */
  199. lockPosition?: boolean;
  200. /** Set to true to block the user showing / hiding the column, the column can only be shown / hidden via definitions or API */
  201. lockVisible?: boolean;
  202. /** Set to true to block the user pinning the column, the column can only be pinned via definitions or API */
  203. lockPinned?: boolean;
  204. /** @deprecated since v20, use colDef.filter=false instead */
  205. suppressFilter?: boolean;
  206. /** Set to true if you want the unsorted icon to be shown when no sort is applied to this column. */
  207. unSortIcon?: boolean;
  208. /** Set to true if you want this columns width to be fixed during 'size to fit' operation. */
  209. suppressSizeToFit?: boolean;
  210. /** @deprecated since v20, use colDef.resizable=false instead */
  211. suppressResize?: boolean;
  212. /** Set to true if this column should be resizable */
  213. resizable?: boolean;
  214. /** Set to true if you do not want this column to be auto-resizable by double clicking it's edge. */
  215. suppressAutoSize?: boolean;
  216. /** Allows user to suppress certain keyboard events */
  217. suppressKeyboardEvent?: (params: SuppressKeyboardEventParams) => boolean;
  218. /** If true, GUI will allow adding this columns as a row group */
  219. enableRowGroup?: boolean;
  220. /** If true, GUI will allow adding this columns as a pivot */
  221. enablePivot?: boolean;
  222. /** If true, GUI will allow adding this columns as a value */
  223. enableValue?: boolean;
  224. /** Set to true if this col is editable, otherwise false. Can also be a function to have different rows editable. */
  225. editable?: boolean | IsColumnFunc;
  226. colSpan?: (params: ColSpanParams) => number;
  227. rowSpan?: (params: RowSpanParams) => number;
  228. /** Set to true if this col should not be allowed take new values from the clipboard . */
  229. suppressPaste?: boolean | IsColumnFunc;
  230. /** Set to tru if this col should not be navigable with the tab key. Can also be a function to have different rows editable. */
  231. suppressNavigable?: boolean | IsColumnFunc;
  232. /** To create the quick filter text for this column, if toString is not good enough on the value. */
  233. getQuickFilterText?: (params: GetQuickFilterTextParams) => string;
  234. /** Callbacks for editing. See editing section for further details.
  235. * Return true if the update was successful, or false if not.
  236. * If false, then skips the UI refresh and no events are emitted.
  237. * Return false if the values are the same (ie no update). */
  238. newValueHandler?: (params: any) => boolean;
  239. /** If true, this cell will be in editing mode after first click. */
  240. singleClickEdit?: boolean;
  241. /** Cell template to use for cell. Useful for AngularJS cells. */
  242. template?: string;
  243. /** Cell template URL to load template from to use for cell. Useful for AngularJS cells. */
  244. templateUrl?: string;
  245. /** one of the built in filter names: [set, number, text], or a filter function*/
  246. filter?: string | {
  247. new (): IFilterComp;
  248. } | boolean;
  249. filterFramework?: any;
  250. /** The filter params are specific to each filter! */
  251. filterParams?: any;
  252. /** Rules for applying css classes */
  253. cellClassRules?: {
  254. [cssClassName: string]: (Function | string);
  255. };
  256. /** Callbacks for editing.See editing section for further details. */
  257. onCellValueChanged?: Function;
  258. /** Function callback, gets called when a cell is clicked. */
  259. onCellClicked?: (event: CellClickedEvent) => void;
  260. /** Function callback, gets called when a cell is double clicked. */
  261. onCellDoubleClicked?: (event: CellDoubleClickedEvent) => void;
  262. /** Function callback, gets called when a cell is right clicked. */
  263. onCellContextMenu?: (event: CellContextMenuEvent) => void;
  264. /** Icons for this column. Leave blank to use default. */
  265. icons?: {
  266. [key: string]: string;
  267. };
  268. /** If true, grid will flash cell after cell is refreshed */
  269. enableCellChangeFlash?: boolean;
  270. /** Never set this, it is used internally by grid when doing in-grid pivoting */
  271. pivotValueColumn?: Column | null;
  272. /** Never set this, it is used internally by grid when doing in-grid pivoting */
  273. pivotTotalColumnIds?: string[];
  274. /** The custom header component to be used for rendering the component header. If none specified the default ag-Grid is used**/
  275. headerComponent?: string | {
  276. new (): any;
  277. };
  278. /** The custom header component to be used for rendering the component header in the hosting framework (ie: React/Angular). If none specified the default ag-Grid is used**/
  279. headerComponentFramework?: any;
  280. /** The custom header component parameters**/
  281. headerComponentParams?: any;
  282. /** Whether to display a floating filter for this column. */
  283. floatingFilter?: boolean;
  284. /** The custom header component to be used for rendering the floating filter. If none specified the default ag-Grid is used**/
  285. floatingFilterComponent?: string | {
  286. new (): IFloatingFilterComp;
  287. };
  288. floatingFilterComponentParams?: any;
  289. floatingFilterComponentFramework?: any;
  290. refData?: {
  291. [key: string]: string;
  292. };
  293. /** Defines the column data type used when charting, i.e. 'category' | 'series' | 'excluded' | undefined **/
  294. chartDataType?: string;
  295. }
  296. export interface IsColumnFunc {
  297. (params: IsColumnFuncParams): boolean;
  298. }
  299. export interface IsColumnFuncParams {
  300. node: RowNode;
  301. data: any;
  302. column: Column;
  303. colDef: ColDef;
  304. context: any;
  305. api: GridApi | null | undefined;
  306. columnApi: ColumnApi | null | undefined;
  307. }
  308. export interface GetQuickFilterTextParams {
  309. value: any;
  310. node: RowNode;
  311. data: any;
  312. column: Column;
  313. colDef: ColDef;
  314. context: any;
  315. }
  316. export interface BaseColDefParams {
  317. node: RowNode;
  318. data: any;
  319. colDef: ColDef;
  320. column: Column;
  321. api: GridApi | null | undefined;
  322. columnApi: ColumnApi | null | undefined;
  323. context: any;
  324. }
  325. export interface BaseWithValueColDefParams extends BaseColDefParams {
  326. value: any;
  327. }
  328. export interface ValueGetterParams extends BaseColDefParams {
  329. getValue: (field: string) => any;
  330. }
  331. export interface NewValueParams extends BaseColDefParams {
  332. oldValue: any;
  333. newValue: any;
  334. }
  335. export interface ValueSetterParams extends NewValueParams {
  336. }
  337. export interface ValueParserParams extends NewValueParams {
  338. }
  339. export interface ValueFormatterParams extends BaseWithValueColDefParams {
  340. }
  341. export interface ColSpanParams extends BaseColDefParams {
  342. }
  343. export interface RowSpanParams extends BaseColDefParams {
  344. }
  345. export interface SuppressKeyboardEventParams extends IsColumnFuncParams {
  346. event: KeyboardEvent;
  347. editing: boolean;
  348. }
  349. export interface CellClassParams {
  350. value: any;
  351. data: any;
  352. node: RowNode;
  353. colDef: ColDef;
  354. rowIndex: number;
  355. $scope: any;
  356. api: GridApi;
  357. columnApi: ColumnApi;
  358. context: any;
  359. }