View Source LiveToast (Live Toast v0.4.0)
LiveComponent for displaying toast messages.
Summary
Functions
Merges a new toast message into the current toast list.
Implement your own function to override the class of the toasts.
toast_group/1 is just a small Phoenix.Component wrapper around the LiveComponent for toasts. You can use the LiveComponent directly if you prefer, this is just a convenience.
Functions
Link to this function
send_toast(kind, msg, title \\ nil, icon \\ nil, action \\ nil, component \\ nil, id \\ "toast-group")
View SourceMerges a new toast message into the current toast list.
Implement your own function to override the class of the toasts.
Example:
defmodule MyModule do
def toast_class_fn(assigns) do
[
"w-80 sm:w-96 z-50 p-2 rounded-md shadow origin-center overflow-hidden",
assigns[:rest][:hidden] != true && "flex",
assigns[:kind] == :info && "text-gray-800 bg-gray-50 dark:bg-gray-800 dark:text-gray-300",
assigns[:kind] == :success &&
"text-green-800 bg-green-50 dark:bg-gray-800 dark:text-green-400",
assigns[:kind] == :error && "text-red-800 bg-red-50 dark:bg-gray-800 dark:text-red-400"
]
end
end
# use it in your layout:
# <LiveToast.toast_group flash={@flash} connected={assigns[:socket] != nil} toast_class_fn={MyModule.toast_class_fn/1} />
toast_group/1 is just a small Phoenix.Component wrapper around the LiveComponent for toasts. You can use the LiveComponent directly if you prefer, this is just a convenience.
Attributes
flash
(:map
) (required) - the map of flash messages.id
(:string
) - the optional id of flash container. Defaults to"toast-group"
.connected
(:boolean
) - whether we're in a liveview or not. Defaults tofalse
.corner
(:atom
) - the corner to display the toasts. Defaults to:top_right
.toast_class_fn
(:any
) - function to override the look of the toasts. Defaults to&LiveToast.toast_class_fn/1
.