UNPKG

@ag-grid-community/react

Version:
56 lines (54 loc) 2.98 kB
// @ag-grid-community/react v26.0.0 "use strict"; var __spreadArrays = (this && this.__spreadArrays) || function () { for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j]; return r; }; var __importStar = (this && this.__importStar) || function (mod) { if (mod && mod.__esModule) return mod; var result = {}; if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k]; result["default"] = mod; return result; }; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); var react_1 = __importStar(require("react")); var react_dom_1 = __importDefault(require("react-dom")); var client_side_row_model_1 = require("@ag-grid-community/client-side-row-model"); var agGridColumn_1 = require("./agGridColumn"); var agGridReactFire_1 = require("./next/agGridReactFire"); require("@ag-grid-community/core/dist/styles/ag-grid.css"); require("@ag-grid-community/core/dist/styles/ag-theme-alpine.css"); var App = function () { var _a = react_1.useState(null), gridApi = _a[0], setGridApi = _a[1]; var _b = react_1.useState(null), gridColumnApi = _b[0], setGridColumnApi = _b[1]; var _c = react_1.useState([ { make: 'Toyota', model: 'Celica', price: 35000 }, { make: 'Ford', model: 'Mondeo', price: 32000 }, { make: 'Porsche', model: 'Boxter', price: 72000 } ]), rowData = _c[0], setRowData = _c[1]; var onGridReady = function (params) { setGridApi(params.api); setGridColumnApi(params.columnApi); setTimeout(function () { return setRowData(__spreadArrays(rowData, rowData)); }, 2000); }; return (react_1.default.createElement("div", { style: { display: 'flex' } }, react_1.default.createElement("div", { className: "ag-theme-alpine", style: { height: 400, width: 600, margin: 10 } }, react_1.default.createElement(agGridReactFire_1.AgGridReactFire, { defaultColDef: { resizable: true, filter: true, flex: 1, sortable: true }, rowSelection: "multiple", animateRows: true, onGridReady: onGridReady, rowData: rowData, modules: [client_side_row_model_1.ClientSideRowModelModule] }, react_1.default.createElement(agGridColumn_1.AgGridColumn, { field: "make" }), react_1.default.createElement(agGridColumn_1.AgGridColumn, { field: "model" }), react_1.default.createElement(agGridColumn_1.AgGridColumn, { field: "price" }))))); }; react_dom_1.default.render(react_1.default.createElement(App, null), document.getElementById('root')); //# sourceMappingURL=index.js.map