SusSnackbar

Transient toast — text, timeout, location, optional actions.

Package

SusKit · Atoms (commercial)

Open in Playground

SusKit · Atoms

Props

Name	Type	Default
Text	Prop<string>	""	v-model
Kicker	Prop<string>	""	v-model
Variant	Prop<string>	"info"	v-model
Timeout	Prop<int>	5000	v-model
Location	Prop<string>	"bottom-center"	v-model
CloseOnContentClick	Prop<bool>	false	v-model
Vertical	Prop<bool>	false	v-model
MultiLine	Prop<bool>	false	v-model
ShowTimer	Prop<bool>	false	v-model
CloseLabel	Prop<string>	"OK"	v-model
Overlay	Prop<bool>	false	v-model
StackOffset	Prop<float>	-1f	v-model

Slots

Name
(default)
actions

Events

Name	Field	Payload
Close	OnClose	—

Style hooks

USS class contract — override appearance without touching C#. States toggle via these classes:

• sus-hidden
• sus-slot
• sus-snackbar
• sus-snackbar__actions
• sus-snackbar__body
• sus-snackbar__close-btn
• sus-snackbar__kicker
• sus-snackbar__main
• sus-snackbar__text
• sus-snackbar__timer
• sus-snackbar--bottom
• sus-snackbar--center
• sus-snackbar--error
• sus-snackbar--info
• sus-snackbar--left
• sus-snackbar--multi-line
• sus-snackbar--overlay
• sus-snackbar--right
• sus-snackbar--success
• sus-snackbar--top
• sus-snackbar--vertical
• sus-snackbar--warning
• sus-snackbar--with-timer
• unity-label
• unity-text-element

Usage

<template>
  <sus:SusSnackbar Text="Saved"
                   Variant="success"
                   Timeout="4000"
                   Location="bottom-center"
                   CloseLabel="OK"
                   @close="OnClosed" />
</template>

<script>
void OnClosed() { /* … */ }
</script>

var toast = new SusSnackbar();
toast.Text.Value = "Connection lost";
toast.Variant.Value = "error";
toast.Timeout.Value = 5000;
toast.ShowTimer.Value = true;
toast.OnClose += () => { /* … */ };

Variant

info · success · warning · error

Toast stack offset

SusSnack.Show(...) toasts live in the shared overlay host and are stacked in code: each one gets an inline bottom. Inline styles beat USS, so a USS bottom on a toast never takes effect. Move the stack with the offset instead:

Way	Scope
--sus-snackbar-stack-offset (px) on the toast's class	Every toast with the class; unset = 24 px
StackOffset on your own SusSnackbar	That toast; wins over the USS property
SusSnack.Show(text, variant, timeoutMs, className)	Classes on that toast only
SusSnack.ContextClass	Classes on every toast until set back to null

The overlay host is outside your screen and skin root, so a rule prefixed with the skin's root class does not reach a toast. Ship the rule in the skin's component sheet layer:

.hud-toast { --sus-snackbar-stack-offset: 216px; }

SusSnack.ContextClass = "hud-toast";   // while the HUD is on screen
SusSnack.ContextClass = null;          // when it closes

Notes

• Slot actions for custom buttons; default close uses CloseLabel.
• Prefer the queue molecule (SusSnackbarQueue) when stacking multiple toasts.