So I have a side bar built using ag-grid and was wondering if it was possible to click on a side bar option without having the tool panel open and have a pop up component instead?
const gridOptions = {
sideBar: {
toolPanels: [
{
id: 'columns',
labelDefault: 'Columns',
labelKey: 'columns',
iconKey: 'columns',
toolPanel: 'agColumnsToolPanel',
minWidth: 225,
maxWidth: 225,
width: 225
},
{
id: 'filters',
labelDefault: 'Filters',
labelKey: 'filters',
iconKey: 'filter',
toolPanel: 'agFiltersToolPanel',
minWidth: 180,
maxWidth: 400,
width: 250
},
{
id: 'myComponent',
labelDefault: 'MyComponent',
labelKey: 'myComponent',
iconKey: 'myComponent',
toolPanel: () => {<MyComponent/>},
minWidth: 180,
maxWidth: 400,
width: 250
}
]
},
}
For example, in the above code, I pass a component (e.g. <MyComponent/>
) in place of the tool panel, but it doesn’t actually open that component when I click on it since it renders on the sideBar loading up.
Can I pass some onClick function into that particular sideBar option to allow me to click on it and open the component?