%= pb_rails("button", props: { text: "Top Center", variant: "secondary", data: { toast: "#toast-top-center" } }) %>
<%= pb_rails("button", props: { text: "Top Left", variant: "secondary", data: { toast: "#toast-top-left" } }) %>
<%= pb_rails("button", props: { text: "Top Right", variant: "secondary", data: { toast: "#toast-top-right" } }) %>
<%= pb_rails("button", props: { text: "Bottom Center", variant: "secondary", data: { toast: "#toast-bottom-center" } }) %>
<%= pb_rails("button", props: { text: "Bottom Left", variant: "secondary", data: { toast: "#toast-bottom-left" } }) %>
<%= pb_rails("button", props: { text: "Bottom Right", variant: "secondary", data: { toast: "#toast-bottom-right" } }) %>
<%= pb_rails("fixed_confirmation_toast", props: {
classname: "toast-to-hide",
closeable: true,
id: "toast-top-center",
text: "Top Center",
status: "neutral",
vertical: "top",
horizontal: "center"
}) %>
<%= pb_rails("fixed_confirmation_toast", props: {
classname: "toast-to-hide",
closeable: true,
id: "toast-top-left",
text: "Top Left",
status: "neutral",
vertical: "top",
horizontal: "left"
}) %>
<%= pb_rails("fixed_confirmation_toast", props: {
classname: "toast-to-hide",
closeable: true,
id: "toast-top-right",
text: "Top Right",
status: "neutral",
vertical: "top",
horizontal: "right"
}) %>
<%= pb_rails("fixed_confirmation_toast", props: {
classname: "toast-to-hide",
closeable: true,
id: "toast-bottom-center",
text: "Bottom Center",
status: "neutral",
vertical: "bottom",
horizontal: "center"
}) %>
<%= pb_rails("fixed_confirmation_toast", props: {
classname: "toast-to-hide",
closeable: true,
id: "toast-bottom-left",
text: "Bottom Left",
status: "neutral",
vertical: "bottom",
horizontal: "left"
}) %>
<%= pb_rails("fixed_confirmation_toast", props: {
classname: "toast-to-hide",
closeable: true,
id: "toast-bottom-right",
text: "Bottom Right",
status: "neutral",
vertical: "bottom",
horizontal: "right"
}) %>