> For the complete documentation index, see [llms.txt](https://docs.boii.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.boii.dev/fivem-free-resources/bduk/components/buttons.md).

# Buttons

<figure><img src="/files/amqRaiyIOWyRcBYdO4w4" alt=""><figcaption></figcaption></figure>

Adds one or more clickable buttons to your layout.\
Use these for confirming actions, opening modals, or triggering logic through custom `on_action` handlers.

***

## Structure

```lua
buttons = {
    {
        id = "confirm_btn",
        label = "Confirm",
        on_action = function(data)
            -- Custom logic for confirming a purchase
        end,
        should_close = true,
        class = "primary"
    },
    {
        id = "cancel_btn",
        label = "Cancel",
        action = "close_builder",
        class = "danger"
    }
}
```

***

## Options

| Key            | Description                                                                 |
| -------------- | --------------------------------------------------------------------------- |
| `id`           | Unique identifier for the button.                                           |
| `label`        | Text shown on the button.                                                   |
| `action`       | (Optional) Use `"close_builder"` to close the UI safely.                    |
| `on_action`    | (Optional) A function to run when clicked. Receives `data` if needed.       |
| `should_close` | (Optional) Closes the UI builder after clicking. Default: `false`.          |
| `class`        | (Optional) Style of button — try `"primary"`, `"danger"`, `"success"`, etc. |
| `icon`         | (Optional) Add an icon, e.g., `"fas fa-check"`.                             |
| `modal`        | (Optional) Show a confirmation modal before running the action.             |
| `dataset`      | (Optional) Extra data to pass to the `on_action` function.                  |

***

## Notes

* Use multiple buttons in a row by adding more entries to the `buttons` table.
* `dataset = {}` gets passed into your `on_action` function.
* Use `should_close = true` if the UI should close after pressing the button.
* Use `modal = { title = "...", description = "..." }` to prompt confirmation before the button runs its logic.
* For closing the UI, use the special global action:

  ```lua
  action = "close_builder"
  ```
