3.0.0






Multiple Users

Default

+2



Close
<%= pb_rails("multiple_users", props: {
  users: [
    {
      name: "Patrick Welch",
      image_url: "https://randomuser.me/api/portraits/men/9.jpg",
    },
    {
      name: "Lucille Sanchez",
      image_url: "https://randomuser.me/api/portraits/women/6.jpg",
    },
    {
      name: "Beverly Reyes",
      image_url: "https://randomuser.me/api/portraits/women/74.jpg",
    },
    {
      name: "Keith Craig",
      image_url: "https://randomuser.me/api/portraits/men/40.jpg",
    },
    {
      name: "Alicia Cooper",
      image_url: "https://randomuser.me/api/portraits/women/46.jpg",
    }
  ]
}) %>

<br/><br/>

<%= pb_rails("multiple_users", props: {
  users: [
    {
      name: "Shawn Palmer",
      image_url: "https://randomuser.me/api/portraits/men/93.jpg",
    },
    {
      name: "Andrew Murray",
      image_url: "https://randomuser.me/api/portraits/men/75.jpg",
    }
  ]
}) %>
Reverse

+2



Close
<%= pb_rails("multiple_users", props: {
  reverse: true,
  users: [
    {
      name: "Patrick Welch",
      image_url: "https://randomuser.me/api/portraits/men/9.jpg",
    },
    {
      name: "Lucille Sanchez",
      image_url: "https://randomuser.me/api/portraits/women/6.jpg",
    },
    {
      name: "Beverly Reyes",
      image_url: "https://randomuser.me/api/portraits/women/74.jpg",
    },
    {
      name: "Keith Craig",
      image_url: "https://randomuser.me/api/portraits/men/40.jpg",
    },
    {
      name: "Alicia Cooper",
      image_url: "https://randomuser.me/api/portraits/women/46.jpg",
    }
  ]
}) %>

<br/><br/>

<%= pb_rails("multiple_users", props: {
  reverse: true,
  users: [
    {
      name: "Shawn Palmer",
      image_url: "https://randomuser.me/api/portraits/men/93.jpg",
    },
    {
      name: "Andrew Murray",
      image_url: "https://randomuser.me/api/portraits/men/75.jpg",
    }
  ]
}) %>
Available Props
id
data
classname
aria
children
reverse
users