Contents

<%= pb_rails("button", props: { text: "Show Closeable Auto Close Toast", variant: "secondary", data: { toast: "#toast-auto-close-closeable" } }) %>

<%= pb_rails("fixed_confirmation_toast", props: {
  auto_close: 10000,
  closeable: true,
  id: "toast-auto-close-closeable",
  text: "I will disappear in 10 seconds.",
  status: "tip",
  vertical: "top",
  horizontal: "center"
}) %>

<script>
  document.addEventListener('DOMContentLoaded', () => {
    const toast10SecCloseable = document.querySelector("#toast-auto-close-closeable")
    const button10SecCloseable = document.querySelector("button[data-toast='#toast-auto-close-closeable']")

    const originalToast = toast10SecCloseable.cloneNode(true)
    
    if (toast10SecCloseable) {
      toast10SecCloseable.remove()
    }

    if (button10SecCloseable) {
      button10SecCloseable.onclick = () => {
        const newToast = originalToast.cloneNode(true)
        newToast.style.display = "flex"
        
        document.body.appendChild(newToast)
      }
    }
  })
</script>

Version data entries

2 entries across 2 versions & 2 rubygems

Version	Path
playbook_ui_docs-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5738	app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb
playbook_ui-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5738	app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb