diff --git a/package-lock.json b/package-lock.json
index 9f04f4c5..41f95da9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,9 +13,9 @@
"@emotion/styled": "^11.11.0",
"@mui/icons-material": "^5.15.7",
"@mui/material": "^5.15.7",
- "ag-grid-community": "31.3.2",
- "ag-grid-enterprise": "31.3.2",
- "ag-grid-react": "31.3.2",
+ "ag-grid-community": "33.0.4",
+ "ag-grid-enterprise": "33.0.4",
+ "ag-grid-react": "33.0.4",
"d3-format": "^3.1.0",
"d3-time": "^3.1.0",
"d3-time-format": "^4.1.0",
@@ -3414,35 +3414,73 @@
}
},
"node_modules/ag-charts-community": {
- "version": "9.3.1",
- "resolved": "https://registry.npmjs.org/ag-charts-community/-/ag-charts-community-9.3.1.tgz",
- "integrity": "sha512-/+dTQXSHbOwmynsKA32b5MmkwYM53sYuRkrL8ZPjTdwnR0uLKhSOrwMryx8U/HqN7YkprmQKtoiLNKU9MQ3hvw=="
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-community/-/ag-charts-community-11.0.4.tgz",
+ "integrity": "sha512-TFShWfZaA1yJ/hb3jwtNAqBG2Qy9VvoQ9mWLr29ilT6+2R2e30RSk2oH7FAQ2l5nS1367dRf137Td9tUTTuVLg==",
+ "license": "MIT",
+ "optional": true,
+ "dependencies": {
+ "ag-charts-locale": "11.0.4",
+ "ag-charts-types": "11.0.4"
+ }
+ },
+ "node_modules/ag-charts-enterprise": {
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-enterprise/-/ag-charts-enterprise-11.0.4.tgz",
+ "integrity": "sha512-3jKKbzei4hzSSbPih0EFyIBJ/VvLDZAi+5QsbzxRHfsjfAuqQFYCNXx55FqOzOGg1KSa8sAwmpmTSGdLPxBfDw==",
+ "license": "Commercial",
+ "optional": true,
+ "dependencies": {
+ "ag-charts-community": "11.0.4"
+ }
+ },
+ "node_modules/ag-charts-locale": {
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-locale/-/ag-charts-locale-11.0.4.tgz",
+ "integrity": "sha512-xCQA8CtcUyqU4qYg7u9oUQ+SghIsWAQvY60Bu0ghJJ/bDeW8+ptEU0ogBapuDqfb9B9kqWKgASxbX6diqb+HVQ==",
+ "license": "MIT",
+ "optional": true
+ },
+ "node_modules/ag-charts-types": {
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-types/-/ag-charts-types-11.0.4.tgz",
+ "integrity": "sha512-K/Mi7FXvSCoABLSrqQ70k1QrIL5R6RNCt2NAppOxMEir+DVFPqKZtghruobc2MGVUUKkT9MCn6Dun+fL6yZjfA==",
+ "license": "MIT"
},
"node_modules/ag-grid-community": {
- "version": "31.3.2",
- "resolved": "https://registry.npmjs.org/ag-grid-community/-/ag-grid-community-31.3.2.tgz",
- "integrity": "sha512-GxqFRD0OcjaVRE1gwLgoP0oERNPH8Lk8wKJ1txulsxysEQ5dZWHhiIoXXSiHjvOCVMkK/F5qzY6HNrn6VeDMTQ=="
+ "version": "33.0.4",
+ "resolved": "https://registry.npmjs.org/ag-grid-community/-/ag-grid-community-33.0.4.tgz",
+ "integrity": "sha512-iBD8g8bNIl95w9CzCQpDid+eTdmOoT39204sPUOhE9eE50vfoDHIaF5U4fRYQHbLsT4bwbXfQYdsqBAOLJL24w==",
+ "license": "MIT",
+ "dependencies": {
+ "ag-charts-types": "11.0.4"
+ }
},
"node_modules/ag-grid-enterprise": {
- "version": "31.3.2",
- "resolved": "https://registry.npmjs.org/ag-grid-enterprise/-/ag-grid-enterprise-31.3.2.tgz",
- "integrity": "sha512-82p7ZQEiLOennoQ3PsPOsh0rI9p6eLKaV/yiD/BQb5rifVQE91N4bi2cFDwL283RWJrbOb7ZuGVdjr5OW5FEuA==",
+ "version": "33.0.4",
+ "resolved": "https://registry.npmjs.org/ag-grid-enterprise/-/ag-grid-enterprise-33.0.4.tgz",
+ "integrity": "sha512-Ig4mBWanf2NAJWF1DDiRJAMwbxaxqhIf4rvr/ub5iFksHyvtk5GNrDHsT5PGGZX7xMjOqZoyFYBNJtK0OfUFWQ==",
+ "license": "Commercial",
"dependencies": {
- "ag-charts-community": "9.3.1",
- "ag-grid-community": "31.3.2"
+ "ag-grid-community": "33.0.4"
+ },
+ "optionalDependencies": {
+ "ag-charts-community": "11.0.4",
+ "ag-charts-enterprise": "11.0.4"
}
},
"node_modules/ag-grid-react": {
- "version": "31.3.2",
- "resolved": "https://registry.npmjs.org/ag-grid-react/-/ag-grid-react-31.3.2.tgz",
- "integrity": "sha512-SFHN05bsXp901rIT00Fa6iQLCtyavoJiKaXEDUtAU5LMu+GTkjs/FPQBQ8754omgdDFr4NsS3Ri6QbqBne3rug==",
+ "version": "33.0.4",
+ "resolved": "https://registry.npmjs.org/ag-grid-react/-/ag-grid-react-33.0.4.tgz",
+ "integrity": "sha512-0Y54BmY03athtqfpO5kTR/gjyP6Qw4LP+EQD2duBZ3yj4SWWlwE1Ob7Lc7OuZRHxl2dxLQy2edagJHrqnmopKw==",
+ "license": "MIT",
"dependencies": {
- "ag-grid-community": "31.3.2",
+ "ag-grid-community": "33.0.4",
"prop-types": "^15.8.1"
},
"peerDependencies": {
- "react": "^16.3.0 || ^17.0.0 || ^18.0.0",
- "react-dom": "^16.3.0 || ^17.0.0 || ^18.0.0"
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/ajv": {
@@ -14698,30 +14736,59 @@
"requires": {}
},
"ag-charts-community": {
- "version": "9.3.1",
- "resolved": "https://registry.npmjs.org/ag-charts-community/-/ag-charts-community-9.3.1.tgz",
- "integrity": "sha512-/+dTQXSHbOwmynsKA32b5MmkwYM53sYuRkrL8ZPjTdwnR0uLKhSOrwMryx8U/HqN7YkprmQKtoiLNKU9MQ3hvw=="
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-community/-/ag-charts-community-11.0.4.tgz",
+ "integrity": "sha512-TFShWfZaA1yJ/hb3jwtNAqBG2Qy9VvoQ9mWLr29ilT6+2R2e30RSk2oH7FAQ2l5nS1367dRf137Td9tUTTuVLg==",
+ "optional": true,
+ "requires": {
+ "ag-charts-locale": "11.0.4",
+ "ag-charts-types": "11.0.4"
+ }
+ },
+ "ag-charts-enterprise": {
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-enterprise/-/ag-charts-enterprise-11.0.4.tgz",
+ "integrity": "sha512-3jKKbzei4hzSSbPih0EFyIBJ/VvLDZAi+5QsbzxRHfsjfAuqQFYCNXx55FqOzOGg1KSa8sAwmpmTSGdLPxBfDw==",
+ "optional": true,
+ "requires": {
+ "ag-charts-community": "11.0.4"
+ }
+ },
+ "ag-charts-locale": {
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-locale/-/ag-charts-locale-11.0.4.tgz",
+ "integrity": "sha512-xCQA8CtcUyqU4qYg7u9oUQ+SghIsWAQvY60Bu0ghJJ/bDeW8+ptEU0ogBapuDqfb9B9kqWKgASxbX6diqb+HVQ==",
+ "optional": true
+ },
+ "ag-charts-types": {
+ "version": "11.0.4",
+ "resolved": "https://registry.npmjs.org/ag-charts-types/-/ag-charts-types-11.0.4.tgz",
+ "integrity": "sha512-K/Mi7FXvSCoABLSrqQ70k1QrIL5R6RNCt2NAppOxMEir+DVFPqKZtghruobc2MGVUUKkT9MCn6Dun+fL6yZjfA=="
},
"ag-grid-community": {
- "version": "31.3.2",
- "resolved": "https://registry.npmjs.org/ag-grid-community/-/ag-grid-community-31.3.2.tgz",
- "integrity": "sha512-GxqFRD0OcjaVRE1gwLgoP0oERNPH8Lk8wKJ1txulsxysEQ5dZWHhiIoXXSiHjvOCVMkK/F5qzY6HNrn6VeDMTQ=="
+ "version": "33.0.4",
+ "resolved": "https://registry.npmjs.org/ag-grid-community/-/ag-grid-community-33.0.4.tgz",
+ "integrity": "sha512-iBD8g8bNIl95w9CzCQpDid+eTdmOoT39204sPUOhE9eE50vfoDHIaF5U4fRYQHbLsT4bwbXfQYdsqBAOLJL24w==",
+ "requires": {
+ "ag-charts-types": "11.0.4"
+ }
},
"ag-grid-enterprise": {
- "version": "31.3.2",
- "resolved": "https://registry.npmjs.org/ag-grid-enterprise/-/ag-grid-enterprise-31.3.2.tgz",
- "integrity": "sha512-82p7ZQEiLOennoQ3PsPOsh0rI9p6eLKaV/yiD/BQb5rifVQE91N4bi2cFDwL283RWJrbOb7ZuGVdjr5OW5FEuA==",
+ "version": "33.0.4",
+ "resolved": "https://registry.npmjs.org/ag-grid-enterprise/-/ag-grid-enterprise-33.0.4.tgz",
+ "integrity": "sha512-Ig4mBWanf2NAJWF1DDiRJAMwbxaxqhIf4rvr/ub5iFksHyvtk5GNrDHsT5PGGZX7xMjOqZoyFYBNJtK0OfUFWQ==",
"requires": {
- "ag-charts-community": "9.3.1",
- "ag-grid-community": "31.3.2"
+ "ag-charts-community": "11.0.4",
+ "ag-charts-enterprise": "11.0.4",
+ "ag-grid-community": "33.0.4"
}
},
"ag-grid-react": {
- "version": "31.3.2",
- "resolved": "https://registry.npmjs.org/ag-grid-react/-/ag-grid-react-31.3.2.tgz",
- "integrity": "sha512-SFHN05bsXp901rIT00Fa6iQLCtyavoJiKaXEDUtAU5LMu+GTkjs/FPQBQ8754omgdDFr4NsS3Ri6QbqBne3rug==",
+ "version": "33.0.4",
+ "resolved": "https://registry.npmjs.org/ag-grid-react/-/ag-grid-react-33.0.4.tgz",
+ "integrity": "sha512-0Y54BmY03athtqfpO5kTR/gjyP6Qw4LP+EQD2duBZ3yj4SWWlwE1Ob7Lc7OuZRHxl2dxLQy2edagJHrqnmopKw==",
"requires": {
- "ag-grid-community": "31.3.2",
+ "ag-grid-community": "33.0.4",
"prop-types": "^15.8.1"
}
},
diff --git a/package.json b/package.json
index 63141aac..939f3a8f 100644
--- a/package.json
+++ b/package.json
@@ -33,9 +33,9 @@
"dependencies": {
"@emotion/react": "^11.11.3",
"@emotion/styled": "^11.11.0",
- "ag-grid-community": "31.3.2",
- "ag-grid-enterprise": "31.3.2",
- "ag-grid-react": "31.3.2",
+ "ag-grid-community": "33.0.4",
+ "ag-grid-enterprise": "33.0.4",
+ "ag-grid-react": "33.0.4",
"@mui/icons-material": "^5.15.7",
"@mui/material": "^5.15.7",
"d3-format": "^3.1.0",
diff --git a/src/lib/components/AgGrid.react.js b/src/lib/components/AgGrid.react.js
index 0cec03f1..cd5dd7c7 100644
--- a/src/lib/components/AgGrid.react.js
+++ b/src/lib/components/AgGrid.react.js
@@ -60,7 +60,6 @@ export default class DashAgGrid extends Component {
}
DashAgGrid.defaultProps = {
- className: 'ag-theme-alpine',
resetColumnState: false,
exportDataAsCsv: false,
selectAll: false,
diff --git a/src/lib/fragments/AgGrid.react.js b/src/lib/fragments/AgGrid.react.js
index fa4d8138..6d736caa 100644
--- a/src/lib/fragments/AgGrid.react.js
+++ b/src/lib/fragments/AgGrid.react.js
@@ -47,12 +47,9 @@ import RowMenuRenderer from '../renderers/rowMenuRenderer';
import {customFunctions} from '../renderers/customFunctions';
import {AgGridReact} from 'ag-grid-react';
+import {AllCommunityModule, ModuleRegistry} from 'ag-grid-community';
-import 'ag-grid-community/styles/ag-grid.css';
-import 'ag-grid-community/styles/ag-theme-alpine.css';
-import 'ag-grid-community/styles/ag-theme-balham.css';
-import 'ag-grid-community/styles/ag-theme-material.css';
-import 'ag-grid-community/styles/ag-theme-quartz.css';
+ModuleRegistry.registerModules([AllCommunityModule]);
// d3 imports
import * as d3Format from 'd3-format';
@@ -1149,7 +1146,7 @@ export default class DashAgGrid extends Component {
cellRendererData: {
value,
colId: props.column.colId,
- rowIndex: props.rowIndex,
+ rowIndex: props.node.sourceRowIndex,
rowId: props.node.id,
timestamp: Date.now(),
},
diff --git a/src/lib/fragments/AgGridEnterprise.react.js b/src/lib/fragments/AgGridEnterprise.react.js
index d1ef1a1f..202f7ba4 100644
--- a/src/lib/fragments/AgGridEnterprise.react.js
+++ b/src/lib/fragments/AgGridEnterprise.react.js
@@ -1,7 +1,13 @@
import React, {Component} from 'react';
-import {LicenseManager} from 'ag-grid-enterprise';
+import {
+ LicenseManager,
+ AllEnterpriseModule,
+ ModuleRegistry,
+} from 'ag-grid-enterprise';
import DashAgGrid, {propTypes} from './AgGrid.react';
+ModuleRegistry.registerModules([AllEnterpriseModule]);
+
export default class DashAgGridEnterprise extends Component {
render() {
const {licenseKey} = this.props;
diff --git a/src/lib/index.js b/src/lib/index.js
index 9975fa91..1cb2c646 100644
--- a/src/lib/index.js
+++ b/src/lib/index.js
@@ -1,3 +1,4 @@
import AgGrid, {getApi, getApiAsync} from './components/AgGrid.react';
export {AgGrid, getApi, getApiAsync};
+export {useGridFilter} from 'ag-grid-react';
diff --git a/src/lib/utils/propCategories.js b/src/lib/utils/propCategories.js
index 957cab1c..2a5c42df 100644
--- a/src/lib/utils/propCategories.js
+++ b/src/lib/utils/propCategories.js
@@ -338,6 +338,8 @@ export const PROPS_NOT_FOR_AG_GRID = [
'selectAll',
'deselectAll',
'deleteSelectedRows',
+ 'selectedRows',
+ 'paginationInfo',
'rowTransaction',
'updateColumnState',
'csvExportParams',
diff --git a/tests/assets/dashAgGridFunctions.js b/tests/assets/dashAgGridFunctions.js
index 2128fa6c..a2965ad9 100644
--- a/tests/assets/dashAgGridFunctions.js
+++ b/tests/assets/dashAgGridFunctions.js
@@ -184,28 +184,26 @@ const {useImperativeHandle, useState, useEffect, forwardRef} = React;
dagfuncs.YearFilter = forwardRef((props, ref) => {
const [year, setYear] = useState('All');
- useImperativeHandle(ref, () => {
- return {
- doesFilterPass(params) {
- return params.data.year >= 2010;
- },
+ dash_ag_grid.useGridFilter({
+ doesFilterPass(params) {
+ return params.data.year >= 2010;
+ },
- isFilterActive() {
- return year === '2010'
- },
+ isFilterActive() {
+ return year === '2010'
+ },
- // this example isn't using getModel() and setModel(),
- // so safe to just leave these empty. don't do this in your code!!!
- getModel() {
- },
+ // this example isn't using getModel() and setModel(),
+ // so safe to just leave these empty. don't do this in your code!!!
+ getModel() {
+ },
- setModel() {
- }
+ setModel() {
}
});
useEffect(() => {
- props.filterChangedCallback()
+ props.onModelChange(year === "All" ? null : year)
}, [year]);
setProps = ({value}) => {
diff --git a/tests/test_cell_value_changed.py b/tests/test_cell_value_changed.py
index dabde15d..ac19e54a 100644
--- a/tests/test_cell_value_changed.py
+++ b/tests/test_cell_value_changed.py
@@ -31,6 +31,9 @@ def test_cv001_cell_value_changed(dash_duo):
columnDefs=[{"field": "Key", "checkboxSelection": True}]
+ [{"field": i} for i in ["Column", "OldValue", "NewValue"]],
rowData=[],
+ dashGridOptions={
+ "rowSelection": {"mode": "singleRow"},
+ },
),
],
style={"margin": 20},
diff --git a/tests/test_custom_filter.py b/tests/test_custom_filter.py
index 2afb68ea..37c30c12 100644
--- a/tests/test_custom_filter.py
+++ b/tests/test_custom_filter.py
@@ -114,7 +114,7 @@ def test_fi003_custom_filter(dash_duo):
grid.wait_for_cell_text(0, 0, "23")
- dash_duo.find_element('.ag-header-cell[aria-colindex="3"] .ag-icon-menu').click()
+ dash_duo.find_element('.ag-header-cell[aria-colindex="3"] .ag-header-cell-filter-button').click()
dash_duo.find_element('.ag-filter label:nth-child(2)').click()
diff --git a/tests/test_dangerous_templates.py b/tests/test_dangerous_templates.py
index c81cc1a3..022ffedd 100644
--- a/tests/test_dangerous_templates.py
+++ b/tests/test_dangerous_templates.py
@@ -74,7 +74,9 @@ def test_dt002_dangerous_templates(dash_duo):
"field": "company",
},
{
- "headerComponentParams": {"template": "Testing
"},
+ "headerComponentParams": {
+ "template": '[]
'
+ },
"field": "price",
"valueFormatter": {"function": """d3.format("($,.2f")(params.value)"""},
},
@@ -122,4 +124,4 @@ def loadBlank(n):
)
dash_duo.find_element("#loadBlank").click()
dash_duo.wait_for_text_to_equal(".ag-overlay-no-rows-wrapper", "whoops no info")
- assert grid.get_header_cell(2).text == "Testing"
+ assert grid.get_header_cell(2).text == "[Price]"
diff --git a/tests/test_grid_apis.py b/tests/test_grid_apis.py
index 3f348a92..4b771fb9 100644
--- a/tests/test_grid_apis.py
+++ b/tests/test_grid_apis.py
@@ -100,7 +100,7 @@ def test_ga001_grid_apis(dash_duo):
app.clientside_callback(
"""function (n) {
if (n) {
- dash_ag_grid.getApi('grid').setColumnVisible("price", false)
+ dash_ag_grid.getApi('grid').setColumnsVisible(["price"], false)
}
return dash_clientside.no_update
}""",
diff --git a/tests/test_scroll_to.py b/tests/test_scroll_to.py
index 052207a6..30da4ee4 100644
--- a/tests/test_scroll_to.py
+++ b/tests/test_scroll_to.py
@@ -123,6 +123,8 @@ def update_scrollTo(n_clicks):
return scroll_to_inputs[n_clicks - 1]
dash_duo.start_server(app)
+ dash_duo.driver.set_window_size(1000, 800)
+
grid = utils.Grid(dash_duo, "grid")
action = utils.ActionChains(dash_duo.driver)
@@ -231,6 +233,7 @@ def reset_columnState(n, s):
return state
dash_duo.start_server(app)
+ dash_duo.driver.set_window_size(1000, 800)
grid = utils.Grid(dash_duo, "grid")
until(lambda: "1" == grid.get_cell(2000, 9).text, timeout=3)
diff --git a/tests/test_user_style.py b/tests/test_user_style.py
index 5276b74c..ca9bcd44 100644
--- a/tests/test_user_style.py
+++ b/tests/test_user_style.py
@@ -52,11 +52,11 @@ def test_us001_user_style(dash_duo):
grid.wait_for_cell_text(0, 0, "Toyota")
until(
lambda: "height: 500px"
- in dash_duo.find_element("div.ag-theme-alpine").get_attribute("style"),
+ in dash_duo.find_element("#grid").get_attribute("style"),
timeout=3,
)
until(
lambda: "width: 500px"
- in dash_duo.find_element("div.ag-theme-alpine").get_attribute("style"),
+ in dash_duo.find_element("#grid").get_attribute("style"),
timeout=3,
)