Thanks, I found a path forward on this. Using beginCellEdit was what I needed.
A few other questions:
- Is there a way to know when a row is resized by the UI, not by a human. There is the onRowResize listener, but it does not get called as that must be when one manually changes height via dragging the edges. I don’t think this is built into the architecture but figured I’d ask. The use case is to know when a row has to repaint itself so I can reopen the edit cell. I am trying to keep everything single click. If I am editing a row and I click another row, that previous row should end its edit and the newly clicked cell enter edit mode. If there is a height difference between the template and the editor the row will repaint killing the edit of the clicked cell.
- Any pointers on changing the CSS of a smart component inside a grid cell, specifically the template? For example a smart-input inside a smart-grid cell. I think using the smart-input has made life harder since it is using its own CSS where if I just used a <div>{{value}}</div> raw HTML the grid CSS would take over. I did not opt to use the built in templates via the strings like ‘input’, ‘date’, etc. I wanted to roll my own. I can change some things (see below), but color does not work at all. It is hard to follow sometimes given there are hundreds of CSS properties some of which are shared across many components.
if (!data.template) {
const input = document.createElement(‘smart-input’);
input.style.border = ‘none’;
input.style.marginLeft = ‘0.50px’;
input.style.width = ‘100%’;
// cant change background color
input.value = data.value;
data.template = input;
} else {
….
}
