@@ -168,26 +168,54 @@ Avoid using different density settings for parent and child rows.
168
168
169
169
!!!
170
170
171
- ### Expand/Collapse All Button
171
+ ### Expand/Collapse All Control
172
+
173
+ #### Button Behavior
174
+
175
+ The button expands first unless all rows have already been expanded, and then it switches to Collapse All.
176
+ - Manual expanding/collapsing does not change the button state.
177
+ - If users collapse rows individually, the button stays Expand All until all rows are collapsed.
178
+
179
+ #### Interactions
180
+
181
+ #### Default State
182
+
183
+ The table can load with any combination of expanded or collapsed rows.
184
+ The button reflects the initial state:
185
+ - Expand All if any rows are collapsed.
186
+ - Collapse All if all rows are expanded.
187
+
188
+ #### Expanding All Rows
189
+
190
+ Clicking Expand All expands everything, including nested rows.
191
+ - The button updates to Collapse All.
192
+
193
+ #### Mixed State
194
+
195
+ Some rows are expanded while others are collapsed.
196
+ The button stays Expand All, as its following action will expand all collapsed rows.
197
+ - Clicking Expand All in this state expands everything and updates the button to Collapse All.
198
+ Expanding from a Mixed State
199
+ - Clicking Expand All expands all rows, including manually collapsed ones.
200
+ - The button updates to Collapse All.
172
201
173
202
#### Button States
174
203
175
204
The button updates based on the current expansion state of the table:
176
205
177
206
- Expand All will display when all rows are collapsed.
178
207
179
- ![ ] ( /assets/components/table/advanced-table/advanced-table-sticky-header .png )
208
+ ![ ] ( /assets/components/table/advanced-table/expandable-rows-collapsed-state .png )
180
209
181
210
- Collapse All will display when all rows are expanded.
182
211
183
- ![ ] ( /assets/components/table/advanced-table/advanced-table-sticky-header.png )
184
-
185
- - Mixed State – Displays when some, but not all, rows are expanded.
186
- - Mixed State Behavior
187
- - The mixed state provides a visual cue that expansion states vary within the table. Selecting the button in this state expands all rows.
212
+ ![ ] ( /assets/components/table/advanced-table/expandable-rows-expanded-state.png )
188
213
189
- ![ ] ( /assets/components/table/advanced-table/advanced-table-sticky-header.png )
214
+ - Mixed State displays when some, but not all, rows are expanded.
190
215
216
+ ![ ] ( /assets/components/table/advanced-table/expandable-rows-mixed-state.png )
217
+ <Doc::ImageCaption @text ="The mixed state provides a visual cue that expansion states vary within the table. Selecting the button in this state expands all rows.
218
+ "/> -->
191
219
### Striping
192
220
193
221
!!! Info
0 commit comments