import { ColDef , GridOptions , ValueFormatterParams } from '@ag-grid-community/core' ; declare function createMockServer ( ) ; const columnDefs = [ { field : 'code' , maxWidth : 90 } , { field : 'name' , minWidth : 200 } , { field : 'bid' , cellClass : 'cell-number' , valueFormatter : numberFormatter , cellRenderer : 'agAnimateShowChangeCellRenderer' , } , { field : 'mid' , cellClass : 'cell-number' , valueFormatter : numberFormatter , cellRenderer : 'agAnimateShowChangeCellRenderer' , } , { field : 'ask' , cellClass : 'cell-number' , valueFormatter : numberFormatter , cellRenderer : 'agAnimateShowChangeCellRenderer' , } , { field : 'volume' , cellClass : 'cell-number' , cellRenderer : 'agAnimateSlideCellRenderer' , } , ] ; function numberFormatter ( params ) { if ( typeof params . value === 'number' ) { return params . value . toFixed ( 2 ) ; } return params . value ; } const gridOptions = { defaultColDef : { flex : 1 , minWidth : 100 , resizable : true , } , enableRangeSelection : true , columnDefs : columnDefs , getRowNodeId : function ( data ) { return data . code ; } , onGridReady : function ( params ) { var mockServer = createMockServer ( ) , initialLoad$ = mockServer . initialLoad ( ) , updates$ = mockServer . byRowupdates ( ) ; initialLoad$ . subscribe ( function ( rowData ) { params . api . setRowData ( rowData ) ; updates$ . subscribe ( function ( updates ) { return params . api . applyTransaction ( { update : updates } ) ; } ) ; } ) ; } , } ; document . addEventListener ( 'DOMContentLoaded' , function ( ) { var gridDiv = document . querySelector ( '#myGrid' ) ; new agGrid . Grid ( gridDiv , gridOptions ) ; } ) ;