SnackBar

A lightweight message with an optional action which briefly displays at the bottom of the screen.

Usage

<template>
  <Button @click="showSnackBar">Show SnackBar</Button>
</template>

<script setup lang="ts">
import { Button, SnackBar } from "fluekit";

const showSnackBar = () => {
  SnackBar.show({
    content: "This is a SnackBar!",
    actionLabel: "Undo",
    onAction: () => console.log("Undo clicked"),
  });
};
</script>

API

Props

Name	Type	Default	Description
content	string	-	The content of the SnackBar.
actionLabel	string	-	The label for the optional action button.
duration	number	4000	The duration in milliseconds for which the SnackBar is visible.

Events

Name	Description
action	Called when the action button is pressed.
close	Called when the SnackBar is closed.