In this snippet:
|
<span className="kuiTableCellContent__text"> |
The issue is that when we want to render full-width cells such as Node distribution in the following table:

We need to do something like .ourTable .kuiTableCellContent__text { width: 100% }. Is this reasonable, or should we have a prop to turn off the text mode, whereby we don't add the extra span highlighted here:

I'd rather not have consumers need to dig into the internal classes as much as possible (in the context of React components at least), since that's the value in React for the most part, abstracting the classes away
In conclusion, would it be possible to do something like:
{
this.props.allowOverflow === true
? children
: <span className='kuiTableCellContent__text'>{ children }</span>
}
In this snippet:
eui/src/components/table/table_row_cell.js
Line 32 in 52636ec
The issue is that when we want to render full-width cells such as Node distribution in the following table:
We need to do something like
.ourTable .kuiTableCellContent__text { width: 100% }. Is this reasonable, or should we have a prop to turn off the text mode, whereby we don't add the extra span highlighted here:I'd rather not have consumers need to dig into the internal classes as much as possible (in the context of React components at least), since that's the value in React for the most part, abstracting the classes away
In conclusion, would it be possible to do something like: