Bulk Edit Pattern
Documentation & guidance for bulk editing. Bulk edit is a pattern for actions that may be performed on multiple items within a table or list. Once the user selects at least one item or enters edit mode, the bulk action bar appears at the top of the section with options.
Figma LINK




Looking through with this, I see like 2-3 different specs and looks in figma.
- Some screenshots have select all checkbox with no text, some have a count of the selected items, some have both.
- Some screenshots of the mobile ones wrap, and others show it on two lines. Also some have a red delete, and others don't. Could we get this most consistent or share what would be the various usecases and looks?
We would need this in order to see what parts we could build and what parts we leave up to the users. Most likely, we will build the component just have the selected count/ firstcheckbox, space for users to add whatever buttons they want, and cancel button.
The controls for the bulk action should be up to the domains, this is mainly a pattern for the interaction framework. We have two styles for how the user initiates bulk edit and how we present the controls.
Need to have a kickoff for this, and go through the different usecases. Makeup looks different, need to get different states and such.
Probably will not do this issue. Will keep it open for now. We need to extract the icon buttons that are present here and create a module for those since those do not exist in skin currently.
Key takeaways from the meeting:
- Accessibility concerns with filter bar appearance and screen reader compatibility.
- Potential issues with data table checkboxes triggering multiple actions.
- Need to clarify button behavior across screen sizes and avoid truncation.
- Questions around hiding buttons and handling overflow.
- Proposal for adding access key to delete button for keyboard users.