patternfly-react icon indicating copy to clipboard operation
patternfly-react copied to clipboard

Table - add "action" variant for cells with actions

Open mcoker opened this issue 4 months ago • 0 comments

Core PR: https://github.com/patternfly/patternfly/pull/7551

This adds .pf-m-action to <td>. The use case is you have a cell(s) with a button/toggle/form-sized-thing in it, but text in the rest of the cells, by default that button/toggle/form-thing will make the row height taller than it needs to be because those elements are taller than the adjacent cells with only text.

This modifier just adjusts the cell's padding to offset the action's extra height so it doesn't impact the whole row height. I imagine it's like <Td hasAction> or something like that? It can go on any <Td>, none or multiple per row.

The only other thought I have with it is that <Td> also accepts an actions prop (https://www.patternfly.org/components/table#td) that makes the cell an "actions" cell, but that's a different thing. That's typically the right-most column, it's intended to be actions you can perform on the row itself (often a kebab menu), and you can only have one per row. I mention it because it's also a way of designating a table cell as an action cell. The difference in the structure is that the actions prop adds .pf-v6-c-table__action to the <td>, where as this feature adds .pf-m-action.

mcoker avatar Jun 18 '25 18:06 mcoker