Trying to get access to the rendered content for a cell

[reinrl]

I have an object for a given cell:

const name = { firstname: "Rich", lastname: "Rein", address: { addressLineOne: "123 Main St", city: "Mytown", stateAbbr: "MN" } }

And so my column is defined as such:

{ Header: "Name", id: "name", accessor: "name", Cell: ({ cell, row }) => { return (<div>{cell.value.firstname} + " " + {cell.value.lastname}); ); } }

Given my table markup, I am trying to apply different static height classes to the table row based on the length of the data in the first cell - which is a trivial task for a cell containing just a string (e.g., const rowClass = cell.value.length > 40 ? "row-height-2" : "row-height-1";). When my content is more complex/nested, like the above example, is there a way to get access to the rendered content coming from the cell renderer function?

Things of note:

• I am trying to come up with a generic solution - in another words, I don't want something specifically looking at firstname and lastname length from this example.
• Ideally, I don't want to just look at all of the keys within the cell.value object, as I may not be using all of them in the cell renderer function. Today I am simply taking the results of a service call, and passing that as the data array to my react-table rendering component - although if there is no easy way to get access to the rendered cell content, I suppose that I could manipulate the data in the service response handler to only include the keys that I need for rendering (which is a whole other set of hoops, especially if you consider things like the nested address object above).

[reinrl]

@tannerlinsley any insights/suggestions?