playbook_ui_docs 14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5738 → 14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5754

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2157a5705a89a2255f41b00ec03a170132064a685d54569e65986a30fbeded78
-  data.tar.gz: 28701af4872b652ee0ae94d98219d66b6ba31f2177648836d7f8ef5679cbc7c6
+  metadata.gz: 78ad68a3a8cb94bf9de6d6caefa6d3918a6d6c469471e4dc32c88802a109feca
+  data.tar.gz: 65febeef99376d292a64ae2f677c65bbca8c9814a939d0d4d1c549347f6ec2dc
 SHA512:
-  metadata.gz: f1093825873f938918776401eb41fecb72bdeef1e1d7f6a2458a409eb28e0943e9409fce1c0df605f047b2752a39c15098a98e5be89f1acbc86dad18efcef37d
-  data.tar.gz: 5bbc66925afa97af118d5850c816af55f3bc019e0e0f8ca456e0dbb85ff11f28ee4466df2c4a235cbc0e379bc97585ea300806f9326368b2c75e597adb7dccc9
+  metadata.gz: ace02b69d3058994e0bf8b61569192e963feaf17b0b489b0285864ccb42f2b8580498c1a2d68654555de5e98d096d27e46fc4fc0e53e57bf8c5a26999947c484
+  data.tar.gz: cf1b1991c3ababd471f2bcc3404cd92b215d967ca0a473d2cac65e5b48646f3391b3b401479a6d03efa9215af844bd5c341ae9109f324409c66ab029487f163b

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb

@@ -1,5 +1,16 @@
+<%= pb_rails("button", props: { text: "Show Auto Close Toast", variant: "secondary", data: { toast: "#toast-auto-close" } }) %>
 <%= 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: 3000,
+  classname: "toast-to-hide",
+  id: "toast-auto-close",
+  text: "I will disappear in 3 seconds.",
+  status: "tip",
+  vertical: "top",
+  horizontal: "center"
+}) %>
+
 <%= pb_rails("fixed_confirmation_toast", props: {
   auto_close: 10000,
   closeable: true,
@@ -11,23 +22,37 @@
 }) %>
 
 <script>
-  document.addEventListener('DOMContentLoaded', () => {
-    const toast10SecCloseable = document.querySelector("#toast-auto-close-closeable")
-    const button10SecCloseable = document.querySelector("button[data-toast='#toast-auto-close-closeable']")
+document.addEventListener('DOMContentLoaded', () => {
+  // Initialize toast elements and buttons
+  const toasts = {
+    '#toast-auto-close': document.querySelector("#toast-auto-close"),
+    '#toast-auto-close-closeable': document.querySelector("#toast-auto-close-closeable")
+  }
+  
+  const buttons = {
+    '#toast-auto-close': document.querySelector("button[data-toast='#toast-auto-close']"),
+    '#toast-auto-close-closeable': document.querySelector("button[data-toast='#toast-auto-close-closeable']")
+  }
 
-    const originalToast = toast10SecCloseable.cloneNode(true)
-    
-    if (toast10SecCloseable) {
-      toast10SecCloseable.remove()
+  // Store original toasts and remove them from DOM
+  const originalToasts = {}
+  Object.entries(toasts).forEach(([id, toast]) => {
+    if (toast) {
+      originalToasts[id] = toast.cloneNode(true)
+      toast.remove()
     }
+  })
 
-    if (button10SecCloseable) {
-      button10SecCloseable.onclick = () => {
-        const newToast = originalToast.cloneNode(true)
+  // Set up button click handlers
+  Object.keys(buttons).forEach((toastId) => {
+    const button = buttons[toastId]
+    if (button) {
+      button.onclick = () => {
+        const newToast = originalToasts[toastId].cloneNode(true)
         newToast.style.display = "flex"
-        
         document.body.appendChild(newToast)
       }
     }
   })
+})
 </script>

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5738
+  version: 14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5754
 platform: ruby
 authors:
 - Power UX