This library is a Work In Progress so changes can still occur.
This library aims to provide you a nice way to inform the user that something occured. By attaching itself at the top level of your application toasts can be persistant between page navigation.
It also provides a very basic input system. Do not abuse it, a toast should be about notifying the user, not asking them to perform an action.
You can see a demo on this page.
How to use ?
Thoth.Elmish.Toastdependency in your Paket files:
paket add Thoth.Elmish.Toast --project <your project>
Attach the toast system to your Elmish program
open Elmish open Thoth.Elmish Program.mkProgram init update view |> Toast.Program.withToast Toast.render |> Program.run
- You can now send
Toastfrom any command in your program.
let update msg model = match msg with | DemoInfo -> model, Toast.message "I am toast of type Info" |> Toast.title "Info" |> Toast.info
Customize the view
This library includes a default
render function. You can use the default function to experiment with the library and see if it fits your needs.
We strongly encourage you to implement your own render.
|Name||F# code||CSS code|
|Default||F# code||CSS code|
|Fulma||F# code||CSS code|
Any time you want to send a toast you need to follow these rules:
- Create it and set its content using
- Pipe any number of Builders you want
- Use one of the Triggers to set its Status and send it
type Status = | Success | Warning | Error | Info
type Position = | BottomRight | BottomLeft | BottomCenter | TopRight | TopLeft | TopCenter
||Create a toast and set the message content|
||Set the title content|
||Set the position|
||Add an input to the toast|
||Set the icon|
||Set the timeout in seconds|
||No timeout, make sure to add a close button or dismiss on click|
||Allow user to dismiss the toast by cliking on it|
||Add a close button|
||Send the toast marked with Success status|
||Send the toast marked with Warning status|
||Send the toast marked with Error status|
||Send the toast marked with Info status|