---
title: SnackBar
description: SnackBar API.
---

import CodeSnippetMD from '@slint/common-files/src/components/CodeSnippetMD.astro';
import SlintProperty from '@slint/common-files/src/components/SlintProperty.astro';

<CodeSnippetMD imagePath="" noScreenShot scale="3" imageWidth="300" imageHeight="200" imageAlt="">
```slint
import { FilledButton, SnackBar } from "@material";
export component Example inherits Window {
    width: 400px;
    height: 200px;
    background: transparent;

    show-snack-bar := FilledButton {
        text: @tr("Show Snack Bar");
        clicked => {
            sb.show();
        }
    }

    sb := SnackBar {
        text: "Message sent";
        action-text: "Undo";
        has-close-button: true;
    }
}
```
</CodeSnippetMD>

A `SnackBar` provides brief messages about app processes at the bottom of the screen. It can include an action and a close button.

## Properties

### action-text
<SlintProperty propName="action-text" typeName="string">
The label for the action button.
</SlintProperty>

### has-close-button
<SlintProperty propName="has-close-button" typeName="bool">
Whether to show a close button on the snackbar.
</SlintProperty>

### text
<SlintProperty propName="text" typeName="string">
The message text displayed in the snackbar.
</SlintProperty>

## Callbacks

### action-clicked()
Invoked when the action button is clicked.
