Row Actions

Row actions appear in the table action column.

Built-in row actions

When enabled, VibeFlui can add:

• detail/view action
• edit action
• delete action
• custom actions.row items

actions: {
  edit: {
    enabled: true
  },
  delete: {
    enabled: true,
    confirm: true
  },
  row: [
    {
      key: "approve",
      label: "Approve",
      icon: "lucide:check",
      handler: "users.approve",
      visibleWhen: {
        key: "status",
        operator: "equals",
        value: "pending"
      }
    }
  ]
}

Action grouping

table.actionGrouping defaults to true.

When action grouping is enabled and a row has more than three actions, VibeFlui keeps up to two priority actions visible and moves the rest to an overflow menu.

Priority direct actions are selected in this order until two direct actions are chosen:

1. view/detail
2. update/edit
3. delete
4. first remaining actions until two direct actions are selected

The overflow trigger uses lucide:list-collapse and the accessible label More actions.

Icon hover style

table: {
  actionIcon: {
    hoverShape: "circle",
    hoverColor: "brand"
  }
}

Supported hover colors:

• gray
• brand
• blue
• green
• orange
• red
• success
• warning
• danger
• error

Readonly mode

When uiMode is "readonly", row actions are not rendered.