table: Rename row_selector to row_header (#2366)

Continue #2357.

Ref:
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/rowheader_role

Author: madcodelife

crates/story/src/stories/data_table_story.rs

@@ -952,9 +952,9 @@ impl DataTableStory {
         });
     }
 
-    fn toggle_row_selector(&mut self, checked: &bool, _: &mut Window, cx: &mut Context<Self>) {
+    fn toggle_row_header(&mut self, checked: &bool, _: &mut Window, cx: &mut Context<Self>) {
         self.table.update(cx, |table, cx| {
-            table.row_selector = *checked;
+            table.row_header = *checked;
             cx.notify();
         });
     }
@@ -1127,10 +1127,10 @@ impl Render for DataTableStory {
                             .on_click(cx.listener(Self::toggle_cell_selection)),
                     )
                     .child(
-                        Checkbox::new("row-selector")
-                            .label("Row Selector")
-                            .selected(table.row_selector)
-                            .on_click(cx.listener(Self::toggle_row_selector)),
+                        Checkbox::new("row-header")
+                            .label("Row Header")
+                            .selected(table.row_header)
+                            .on_click(cx.listener(Self::toggle_row_header)),
                     )
                     .child(
                         Checkbox::new("fixed")

crates/ui/src/table/data_table.rs

@@ -66,8 +66,8 @@ impl Default for TableOptions {
 ///
 /// When cell selection is enabled via [`TableState::cell_selectable()`]:
 /// - Click on cells to select them
-/// - A row selector column appears on the left for selecting entire rows
-///   (use [`TableState::row_selector()`] to hide it)
+/// - A row header column appears on the left for selecting entire rows
+///   (use [`TableState::row_header()`] to hide it)
 /// - Keyboard navigation (arrow keys, Tab, Home, End, PageUp, PageDown) works at cell level
 /// - Right-click and double-click events are supported
 ///

crates/ui/src/table/state.rs

@@ -134,7 +134,7 @@ impl TableVisibleRange {
 /// - Double-click on cells to trigger actions
 /// - Navigate between cells using keyboard (arrow keys, Home, End, PageUp, PageDown, Tab)
 ///
-/// When in cell selection mode, a row selector column appears on the left side,
+/// When in cell selection mode, a row header column appears on the left side,
 /// allowing users to select entire rows by clicking on it.
 ///
 /// # Events
@@ -200,20 +200,20 @@ pub struct TableState<D: TableDelegate> {
     ///
     /// When enabled:
     /// - Users can click on individual cells to select them
-    /// - A row selector column appears on the left for selecting entire rows
-    ///   (can be hidden via [`Self::row_selector`])
+    /// - A row header column appears on the left for selecting entire rows
+    ///   (can be hidden via [`Self::row_header`])
     /// - Keyboard navigation works at the cell level (arrow keys move between cells)
     /// - Right-click and double-click events are supported for cells
     pub cell_selectable: bool,
-    /// Whether the row selector column is visible when `cell_selectable` is enabled,
+    /// Whether the row header column is visible when `cell_selectable` is enabled,
     /// default is `true`.
     ///
-    /// Set to `false` to hide the narrow leftmost selector column while keeping cell
+    /// Set to `false` to hide the narrow leftmost header column while keeping cell
     /// selection — useful when you want to put your own content (e.g. a row index
     /// column) on the left. When hidden, clicking the already-selected cell again
     /// escalates the selection to the whole row so users can still pick rows; row
     /// escalation requires `row_selectable` to be enabled.
-    pub row_selector: bool,
+    pub row_header: bool,
     /// Whether the table can sort.
     pub sortable: bool,
     /// Whether the table can resize columns.
@@ -271,7 +271,7 @@ where
             col_selectable: true,
             row_selectable: true,
             cell_selectable: false,
-            row_selector: true,
+            row_header: true,
             sortable: true,
             col_movable: true,
             col_resizable: true,
@@ -334,7 +334,7 @@ where
     ///
     /// When enabled:
     /// - Individual cells become selectable by clicking
-    /// - A row selector column appears on the left side (can be hidden via [`Self::row_selector`])
+    /// - A row header column appears on the left side (can be hidden via [`Self::row_header`])
     /// - Keyboard navigation operates at the cell level
     /// - Cell-specific events (SelectCell, DoubleClickedCell, RightClickedCell) are emitted
     ///
@@ -344,26 +344,26 @@ where
     /// let table_state = cx.new(|cx| {
     ///     TableState::new(delegate, cx)
     ///         .cell_selectable(true)  // Enable cell selection
-    ///         .row_selectable(true)   // Also allow row selection via row selector
+    ///         .row_selectable(true)   // Also allow row selection via row header
     /// });
     /// ```
     pub fn cell_selectable(mut self, cell_selectable: bool) -> Self {
         self.cell_selectable = cell_selectable;
         self
     }
 
-    /// Set whether the row selector column is shown, default is `true`.
+    /// Set whether the row header column is shown, default is `true`.
     ///
-    /// Only effective when `cell_selectable` is `true` — otherwise the row selector
+    /// Only effective when `cell_selectable` is `true` — otherwise the row header
     /// column is never rendered. Hide it when you want to use the leftmost column
     /// for your own content (e.g. a row index column).
     ///
     /// When hidden, the first click on a cell selects the cell; clicking the
     /// already-selected cell again escalates to selecting the whole row, so users
-    /// can still pick rows without the dedicated selector column. The row escalation
+    /// can still pick rows without the dedicated header column. The row escalation
     /// requires `row_selectable` to be enabled.
-    pub fn row_selector(mut self, row_selector: bool) -> Self {
-        self.row_selector = row_selector;
+    pub fn row_header(mut self, row_header: bool) -> Self {
+        self.row_header = row_header;
         self
     }
 
@@ -692,14 +692,14 @@ where
 
         let is_double_click = e.click_count() == 2;
 
-        // When the row selector column is hidden, a single click on the
+        // When the row header column is hidden, a single click on the
         // already-selected cell escalates the selection to the entire row —
-        // giving users a way to pick rows without the dedicated selector column.
+        // giving users a way to pick rows without the dedicated header column.
         // Double-clicks are passed through to `DoubleClickedCell` and never
         // trigger the escalation.
         let is_reselect = self.selection_mode.is_cell()
             && self.selected_cell == Some((row_ix, col_ix));
-        let should_escalate_to_row = !self.row_selector
+        let should_escalate_to_row = !self.row_header
             && self.row_selectable
             && is_reselect
             && !is_double_click;
@@ -1291,15 +1291,15 @@ where
             .into_any_element()
     }
 
-    /// Render the row selector cell (when cell_selectable is enabled)
-    fn render_row_selector_cell(
+    /// Render the row header cell (when cell_selectable is enabled)
+    fn render_row_header_cell(
         &self,
         row_ix: usize,
         is_head: bool,
         cx: &mut Context<Self>,
     ) -> impl IntoElement {
         div()
-            .id(("row-selector", row_ix))
+            .id(("row-header", row_ix))
             .w_3()
             .h_full()
             .border_r_1()
@@ -1526,8 +1526,8 @@ where
             .bg(cx.theme().table_head)
             .text_color(cx.theme().table_head_foreground)
             .refine_style(&style)
-            .when(self.cell_selectable && self.row_selector, |this| {
-                this.child(self.render_row_selector_cell(0, true, cx))
+            .when(self.cell_selectable && self.row_header, |this| {
+                this.child(self.render_row_header_cell(0, true, cx))
             })
             .when(left_columns_count > 0, |this| {
                 let view = view.clone();
@@ -1709,8 +1709,8 @@ where
                         this.bg(cx.theme().table_hover)
                     }
                 })
-                .when(self.cell_selectable && self.row_selector, |this| {
-                    this.child(self.render_row_selector_cell(row_ix, false, cx))
+                .when(self.cell_selectable && self.row_header, |this| {
+                    this.child(self.render_row_header_cell(row_ix, false, cx))
                 })
                 .when(left_columns_count > 0, |this| {
                     // Left fixed columns
@@ -1976,8 +1976,8 @@ where
                 .border_b_1()
                 .border_color(cx.theme().table_row_border)
                 .when(is_stripe_row, |this| this.bg(cx.theme().table_even))
-                .when(self.cell_selectable && self.row_selector, |this| {
-                    // Render empty row selector cell for fake rows
+                .when(self.cell_selectable && self.row_header, |this| {
+                    // Render empty row header cell for fake rows
                     this.child(
                         div()
                             .w(px(40.))