Setup
📘Documentation + setup guide: https://sl1nk.com/8ZLgn

① Install the plugin and drop the Toast element on your page (anywhere).
✅ The element is a true overlay and does NOT occupy page space.

② Configure element defaults (optional):
• Default position + default duration
• Queue enabled + max visible toasts
• Dedupe enabled + dedupe window
• Close button / close on tap / pause on hover / swipe to dismiss
• Style preset + radius + shadow + max width + stack spacing
• Safe area mode + z-index
• Debug logging (optional)

Show a toast (Workflow)

Use the action “Show Toast” and provide:
• Message
• Type (Info / Success / Warning / Error / Custom)
• Duration (seconds) OR Sticky = -1

Optional:
• Action button text + Action ID
• Dedupe key
• Position override (use a different position than the default)

Clicks & “Undo” workflows

Use the events:
• Toast action clicked → read last_action_id_clicked
• Toast clicked → read last_clicked_toast_id

Recommended Undo pattern:

① Show toast: “Item deleted” + action button “Undo” (Action ID = undo_delete)
② When event “Toast action clicked” runs, check last_action_id_clicked = undo_delete
③ Restore item
④ Optional: show “Restored ✅” for a premium feel

Debug (how to confirm it works)

① Turn ON “Debug logging” in the element properties
② Open Preview
③ Open DevTools Console (Chrome: F12 → Console)
④ Trigger a toast
✅ You should see logs prefixed with [PredictaToasts] (or your logger prefix)

Demo app editor:
🔗 https://bubble.io/page?id=toast-demo-85304&tab=Design&name=index&type=page&elements=bTGYf